[RÉGLÉ] Lien vers Google Street View

[alaindg]

Bonjour,

J'ai fait un shooting Google Street View de notre établissement et je voudrais l'insérer dans un article sur mon site en Joomla en cliquant sur l'image du logo Google Street View.

J'ai reçu le lien suivant du photographe, mais je n'arrive pas à l'insérer. Quand je fais un copier coller dans le code source de mon article, Joomla ne l'enregistre pas en l'état.

<iframe src="https://www.google.com/maps/embed?pb=!1m0!4v1510843613661!6m8!1m7!1sCAoSLEFGMV FpcE9LekZ1NEFXcEFBWkpJM3NwYk5BSk5GV25qSFBNbGhTYkF4 eU5E!2m2!1d50.518660704295336!2d5.222107117821095! 3f328.2343295257333!4f-5.481540079137304!5f0.7820865974627469" width="600" height="450" frameborder="0" style="border:0" allowfullscreen></iframe>

Comment dois je faire ?
(L'adresse du logo Google Street View est /images/stories/GoogleStreetView.png)

Merci beaucoup

Alain

[lomart]

Bonsoir,

Quand je fais un copier coller dans le code source de mon article, Joomla ne l'enregistre pas en l'état.

Le souci est que votre éditeur wysiwyg efface le code. Plusieurs solutions :

1 - passer en mode code dans l'éditeur et ne jamais revenir sur l'article en mode wysiwyg (risqué)

2 - mettre votre code dans un module qui n'accepte que du code (ex: https://lomart.fr/extensions/lm-custom) et insérer le module dans l'article par un loaadposition

3 - utiliser mon plugin UP pour éviter tous risques d'effacement avec le code suivant : (https://up.lomart.fr/demo/action-html)

{up html=iframe | src=https://www.google.com/maps/embed?pb=!1m0!4v1510843613661!6m8!1m7!1sCAoSLEFGMV FpcE9LekZ1NEFXcEFBWkpJM3NwYk5BSk5GV25qSFBNbGhTYkF4 eU5E!2m2!1d50.518660704295336!2d5.222107117821095! 3f328.2343295257333!4f-5.481540079137304!5f0.7820865974627469 |width=600 | height=450 | frameborder=0 | style=border:0 | allowfullscreen}

Ces solutions affiche l'image dans l'article.

[alaindg]

Bonjour,

Merci beaucoup, c'est vraiment une belle avancée !

J'ai juste un petit souci de paramétrage.

Même en effaçant les "|width=600 | height=450", l'affichage se présente comme une longue barre.
Je n'arrive pas à une présentation en fenêtre complète.

{up html=iframe | src=https://www.google.com/maps/embed?pb=!1m0!4v1510843613661!6m8!1m7!1sCAoSLEFGMV FpcE9LekZ1NEFXcEFBWkpJM3NwYk5BSk5GV25qSFBNbGhTYkF4 eU5E!2m2!1d50.518660704295336!2d5.222107117821095! 3f328.2343295257333!4f-5.481540079137304!5f0.7820865974627469 | frameborder=0 | style=border:0 | allowfullscreen}

J'ai essayé d'effacer complètement les directives d'affichages ou de les remplacer par "| width=50% | style=text-align:center}"

Rien n'y fait, j'ai toujours le même affichage.

http://www.cliniquevethuy.be/index.php/visite-guidee/google-street-view

Comment dois-je faire ?

Encore un grand merci en tous cas.

Alain

[lomart]

Bonjour,

Je me suis permis de mettre votre exemple comme démo sur le site de UP : https://up.lomart.fr/demo/action-html
Je peux le laisser ou le retirer à votre convenance

En attendant, cela vous montre le résultat que j'obtiens avec le code indiqué au-dessous.

Le bouton en haut à droite de l'iframe permet d'afficher en plein écran.

Cette action est spéciale dans le sens où tous les paramètres seront attribués à la balise indiqué. C'est pour cela que je fais le positionnement dans la page dans un bloc parent

[alaindg]

Bonjour,

Voilà, j'y suis arrivé !
Votre plugin est génial.

Le truc c'est de bien insérer le code dans le code source via le bouton < > de l'éditeur wysiwig.
Je faisais l'erreur de l'insérer directement dans l'éditeur.

Vous pouvez sans problème le publier comme exemple sur le site de UP.

Encore un grand merci.

Alain

[lomart]

Bonjour,

Le truc c'est de bien insérer le code dans le code source via le bouton < > de l'éditeur wysiwig.
Je faisais l'erreur de l'insérer directement dans l'éditeur.

L'erreur devait être ailleurs.
Je viens de tester avec JCE brut d'install et TinyMCE, l'insertion se fait correctement en mode wysiwyg.
C'est d'ailleurs un des points forts de UP que de pouvoir insérer du code sans être en mode code et surtout empêcher qu'il soit effacé lors de la sauvegarde

[lomart]

Une petite précision. Le code devrait être :

 <div style="text-align:center">
[B]{[/B]up html=iframe  
| src=https://www.google.com/maps/embed?pb=!1m0!4v1510843613661!6m8!1m7!1sCAoSLEFGMV FpcE9LekZ1NEFXcEFBWkpJM3NwYk5BSk5GV25qSFBNbGhTYkF4 eU5E!2m2!1d50.518660704295336!2d5.222107117821095! 3f328.2343295257333!4f-5.481540079137304!5f0.7820865974627469  
|width=600  
| height=450  
| frameborder=0  
| style=border:0  
| allowfullscreen[B]}[/B]
  impossible d'afficher le contenu
[B]{[/B]/up html[B]}[/B]
</div>

Cela permet d'afficher un contenu alternatif si l'iframe ne peut être affiché. Mais surtout, cela ferme la balise HTML.
Dans la prochaine version de UP, la balise sera fermée automatiquement si nécessaire, même en l'absence de contenu

Une astuce pour saisir la balise div ou p pour le centrage en mode wysiwyg:
1/ taper 2 lettres quelconque (exemple: XX), puis faite la mise en forme (centrage, ...) à l'aide des boutons de l'éditeur
2/ insérer le shortcode entre ces 2 lettres
3/ supprimer les 2 lettres