Pouvoir afficher un emplacement précis grâce à une carte dans un article (ou dans un module) est une fonctionnalité qui s'avère être intéressante à fournir aux visiteurs qui cherchent à vous localiser. Cela peut se faire très simplement et sans recourir à l'ajout d'une extension tierce. Nous allons voir au travers de ce tutoriel comment afficher une carte Google dans un article de votre site Joomla 4.

Vérifier les filtres pour afficher une carte Google dans un article

Par défaut, Joomla filtre l'ajout de certaines balises par mesure de sécurité. Il faut donc s'assurer qu'en tant que super user, vous avez la possibilité d'ajouter le code Google dans vos articles.

Dans le menu latéral du panneau d'administration de Joomla, cliquez sur Système puis sur Configuration globale dans la rubrique Réglages.

Sur la page des paramètres du site, cliquez sur l'onglet Filtres de textes.

Filtres de texte pour ajouter une iframe

Pour les utilisateurs de niveau Super users, réglez le paramètre sur Aucun filtre.
N'oubliez pas de cliquer sur le bouton Enregistrer et fermer pour enregistrer vos modifications.

Droits super user filtres de texte

Le code de la carte Google

Ouvrez maintenant Google Maps.
Dans la barre de recherche, indiquez l'emplacement à afficher sur la carte.
Dans ce tutoriel, nous afficherons la carte de la Bretagne (au hasard^^).

Afficher une carte Google dans un article

Pour obtenir le code de cette carte, cliquez maintenant sur Partager.
Dans la fenêtre modale qui s'ouvre, cliquez sur l'onglet Intégrer la carte.

Afficher une carte Google dans un article

Avec votre souris, faites un clic droit sur le code de la balise iframe puis cliquez sur Copier.

Ajouter une carte Google dans un article

Ouvrez le panneau d'administration de Joomla 4.
Cliquez sur Contenus puis en face d'Articles, cliquez sur pour créer un nouvel article.

Afficher une carte Google dans un article

Si vous utilisez l'éditeur TinyMCE, cliquez d'abord sur le bouton Activer/Désactiver l'éditeur situé sous la zone de saisie du texte.

Collez maintenant le code de la carte Google dans la zone de texte. Indiquez un titre à votre article et ajoutez le à la catégorie de votre choix.

Afficher une carte Google dans un article

Cliquez sur Enregistrer et fermer pour sauvegarder votre saisie.

Affichez maintenant le frontend du site pour constater l'affichage de la carte dans l'article :

Afficher une carte Google dans un article

Pouvoir afficher un emplacement précis grâce à une carte dans un article (ou dans un module) est une fonctionnalité qui s'avère être intéressante à fournir aux visiteurs qui cherchent à vous localiser. Cela peut se faire très simplement et sans recourir à l'ajout d'une extension tierce. Nous allons voir au travers de ce tutoriel comment afficher une carte Google dans un article de votre site Joomla 3.

Les filtres

Par défaut, Joomla filtre l'ajout de certaines balises par mesure de sécurité. Il faut donc par s'assurer qu'en tant que super user, vous avez la possibilité d'ajouter le code Google dans vos articles.

A partir du panneau d'administration, ouvrez Système, Configuration puis cliquez sur l'onglet Filtre de textesstrong>.

Afficher une carte Google dans un article

Si ce n'est pas le cas, règlez le paramètre sur Aucun filtre pour le groupe Super administrateur :

Afficher une carte Google dans un article

Le code Google

Ouvrez maintenant Google Maps.
Dans la barre de recherche, indiquez l'emplacement à afficher sur la carte (dans ce tutoriel, nous afficherons la carte de France).

Afficher une carte Google dans un article

Pour obtenir le code de cette carte, cliquez maintenant sur Partager.
Dans la fenêtre qui s'ouvre, cliquez sur l'onglet Intégrer la carte.

Afficher une carte Google dans un article

Avec votre souris, faites un clic droit sur le code surligné en bleu dans l'image puis cliquez sur Copier.

L'ajout dans l'article

Revenons sur le panneau d'administration de Joomla.
Cliquez sur Contenu puis sur Articles et enfin sur Ajouter un nouvel article.

Afficher une carte Google dans un article

Afin de pouvoir ajouter le code de la carte Google que nous venons de copier, cliquez d'abord sur le bouton Basculer l'éditeur situé sous la zone de saisie du texte.

Collez maintenant le code de la carte Google dans la zone de texte. Indiquez un titre à votre article et ajoutez le à la catégorie de votre choix.

Afficher une carte Google dans un article

Cliquez sur Enregistrer et fermer pour sauvegarder votre saisie.

Affichez maintenant le frontend du site pour constater l'affichage de la carte dans l'article :

Afficher une carte Google dans un article

web-eau.net

29800 Landerneau

+33 674 502 799

daniel@web-eau.net