Aujourd’hui, nous allons voir comment insérer 1 plan de situation sur son site ou blog.
En d’autres termes, comment faire pour afficher 1 carte Google où apparaît son entreprise/point de vente.
Pourquoi publier 1 plan de situation?
Il peut être utile, et je le recommande, de publier 1 carte de localisation sur son site, et ceci pour différentes raisons:
- Comme vous le savez, un certain nombre d’entre nous ont besoin de visualiser les choses
- Vous évitez à vos visiteurs d’avoir à faire 1 recherche supplémentaire et par là-même qu’ils arrivent chez votre concurrent!
- Cela renforce votre crédibilité: vous ne cherchez pas à cacher quoique ce soit.
- Un itinéraire peut être proposé aux internautes qui le souhaitent.
Comment insérer 1 plan de situation sur son site?
Vous allez voir, c’est très simple et cela se fait en 2 minutes!
- Tout d’abord, rendez-vous sur Google Maps
- Indiquez votre adresse dans la barre de recherche et validez
- Vérifiez que votre localisation est juste (il arrive que certaines adresses ne soient pas prises en charge ou s’affichent mal)
- Si tout est bon, cliquez sur le symobole « Lien » (à droite du symbole imprimante) et sur « Personnaliser et prévisualiser la carte intégrée » en bas à droite de la fenêtre contextuelle.
- Dans la fenêtre qui s’est ouverte, cliquez sur « Personnalisée » et indiquez dans les cases adéquates les largeur et hauteur désirées.
- Copiez le code HTML qui apparaît sous la carte et collez-le à l’endroit souhaité pour l’intégrer à votre site Web.
- Enregistrez et c’est fini!
Les explications en diapositives:
Cliquez sur les images pour les agrandir!
Astuces et recommandations:
- faites attention de configurer des dimensions qui correspondent à l’emplacement où vous allez insérer la carte, afin de ne pas dénaturer votre site internet et de conserver 1 certaine cohérence graphique. Il faut donc adapter les dimensions de la carte selon l’endroit où vous la publiez (corps de la page, side-bar ou footer).
- il n’y a pas de ratio imposé par Google entre la hauteur et la largeur, elles peuvent être égales comme elles peuvent être radicalement différentes. Cependant, sachez que pour 1 affichage optimal avec votre adresse en légende, il convient de leur donner la même valeur.
- sachez qu’1 largeur de 580 devrait normalement être facilement intégrable dans la plupart des sites et blogs (à vérifier tout de même).
- lorsque vous insérez le code HTML de votre carte fourni par Google dans 1 page ou 1 article, vous devez être en mode « HTML » dans votre éditeur, car en mode « Visuel » vous risquez d’avoir des bugs (voir illustration ci-dessous).
Comment afficher la carte en barre latérale ou en pied de page?
Si vous souhaitez publier votre carte en barre latérale ou en pied de page, il vous suffit de coller le code HTML dans 1 widget « Texte » que vous placerez ensuite où vous voulez.
Voici comment faire sous WordPress:
- Dans la barre de menu latérale (sur la gauche) de votre administration, cliquez sur « Apparence« , puis sur « Widgets«
- Faites glisser 1 widget « Texte » (Texte ou code HTML arbitraire) dans la zone souhaitée
- Insérez le code dans le Widget et indiquez 1 titre si besoin est
- Cliquez sur « Enregistrer » et le tour est joué!
Mise à jour du 17 décembre 2013
Je viens de réaliser le tutoriel vidéo qui illustre cet article et je vous invite à le découvrir ci-dessous 😉
Si vous avez trouvé une faute d’orthographe ou une coquille, vous pouvez m’en informer en sélectionnant le texte en question et en appuyant sur Ctrl + Entrée. Je vous en remercie par avance.
Merci l’article est très explicité et bien illustré. Un référence de plus pour les débutants.
Bonjour et merci de votre sollicitation.
Je suis allé voir la page que vous m’avez indiquée, mais j’ai 1 fois de plus constaté que les explications de Google sont plus que hasardeuses et que les liens sont cassés, ne mènent à rien ou à des pages qui personnellement me font fuir!
Me voilà donc bien avancé!
Bonjour Paul et bienvenu.
Merci pour les compliments. Ca tombe bien, car c’est justement plutôt aux débutants que je m’adresse.
J’ai vu que tu tenais 1 annuaire. Serais-tu intéressé par 1 article invité ou 1 interview sur le sujet des annuaires?
A bientôt,
Bruno
Un petit message pour vous dire que vos images sont beaucoup trop grosses sur votre site, notamment la banniere sur l’index, à la campagne on en est encore au 1 mega , du coup votre page mets presque 1mn à télécharger, vous devriez utiliser developers.google.com/speed/pagespeed/insights pour tester, je crois que vous seriez surpris, d’autant qu’un site qui charge vite gagne des places dans les résultats naturels 😉
C’est sur que les informations transmises par google font fuir, d’autant qu’on ne sait pas si ce qu’ils disent est vrai tant ils font de la désinformation, en tout les cas, votre image de header est bien trop grosse pour des petites connexions, ( si vous avez de la famille à la campagne avec des petites connexion demandez leur de tester ).
Bonne journée !
Vous avez raison, je ne l’ai pas optimisé car ce n’est pas le thème définitif et il va falloir que je m’y colle!
Bonne journée à vous.
Pour compléter les informations de Frédéric, les images présentes sur l’article sont en *.png (ce format est réservé lorsque l’on souhaite gérer la transparence sur une image *) donc pour information si je prends la première image Google-Maps-800×449.png elle pèse 615 ko, or une image de cette taille devrait être en *.jpg et ne pas dépasser 60ko en jouant sur la compression de l’image en jpg. En conclusion gain de 545Ko, si vous multipliez par le nombre d’images sur votre article, vous allez comprendre rapidement et surtout vos pages vont s’afficher beaucoup plus rapidement.
*: La transparence est utilisée comme pour votre logo en haut de page qui lui impose ce format par ce que vous conservez la couleur de fond autour de votre logo qui a une forme arrondie, sinon systématiquement préférez le format *.jpg qui lui est un format compressé.
Je ne sais pas quel outil vous utilisez pour sauvegarder vos images, mais presque tous les outils (Gimp, Photoshop…) proposent des enregistrements dans les format *.jpg ou *.png.
Voila si cela peut aider certains de vos lecteurs.
Cordialement.
Bonjour Didier,
Vous avez parfaitement raison. C’est 1 grossière faute d’inattention de ma part!
J’utilise en général Paint et en effet, si on ne fait pas attention à l’extension au moment de l’enregistrement de l’image, il la met automatiquement en .png.
Je vais remédier à cela.
Merci de votre contribution et bonne journée.
Un point essentiel, vous avez tout dit sur la création et la mise ne ligne sur un site de la fiche de géolocalisation de Google, mais même si cet article s’adresse au débutant, ils seront un jour ou l’autre confronté au référencement. Ainsi, n’oubliez pas que cette google adresse se référence comme tout site internet, ainsi il est important de positionner des ancres optimisées comme lien sur cette fiche, ce qui vous permettra d’accroître le référencement et le positionnement de cette fiche. 😉
Bonsoir,
Je pense que vous faites 1 amalgame entre 1 fiche Google Adresse, qui n’existe plus et a été remplacée par les pages Google Plus, et afficher 1 carte sur son site (le sujet que je traite).
Il n’est donc pas question de référencer 1 quelconque fiche ici.
A bientôt,
Bruno
Moi qui suis débutante j’ai réussi tant bien que mal !!! grâce à ton article !!Merci beaucoup
Bonsoir et bienvenue,
Heureux d’avoir pu t’aider!
Bonjour à tous,
Je fais un « up » de cet article car je viens de réaliser et d’intégrer le tutoriel vidéo qui y correspond 😉
Amicalement,
Bruno