Sur votre site internet, vous avez certainement une page contact sur laquelle vous précisez vos coordonnées voire proposez un formulaire de contact, mais vous aimeriez peut-être mettre un plan d’accès pour que vos clients puisse venir directement chez-vous (bureau, magasin…). Pour cela il est possible d’intégrer simplement une carte interactive grâce à Google Maps. Grâce à ce tutoriel, vous saurez le faire en quelques minutes !

• Les prérequis pour intégrer une Google Maps sur son site web

  Pour suivre ce didacticiel il vous faut :

• un navigateur internet pour utiliser le service cartographique de Google
• un éditeur de code HTML: logiciel ou CMS (WordPress)
• et c’est tout ????

1 – Générer la carte Google Maps

Génération du code HTML d’une carte Google Maps

Saisie et recherche de l’adresse dans Google Maps

Dans un premier temps, il vous faut ouvrir votre navigateur et vous rendre sur Google Maps à l’adresse https://maps.google.fr/ puis :

• Saisissez votre adresse complète dans le champ de recherche. Google recherche au fur et à mesure de la saisie ; il est d’ailleurs très fort pour ça ! Pour l’exemple j’ai saisi l’adresse de mon appartement quand j’étais étudiant ????
• Une fois que vous trouvez votre adresse dans les suggestions, cliquez dessus: cela va directement lancer la recherche, c’est-à-dire afficher la carte à l’adresse demandée en y positionnant un marqueur.
• Ensuite, cliquez sur l’icône en forme de roue crantée placée en bas en droite de la carte proche des boutons de navigation, puis cliquez sur « Partager ou intégrer la carte» :
• Une fenêtre en superposition de la carte apparait, cliquez alors sur le libellé « Intégrer la carte »
• Votre carte s’affiche en aperçu. Il vous est alors possible de choisir la taille souhaitée dans la page de votre site internet : petite, moyenne, grande ou une taille personnalisée ; sa taille est directement redimensionnée en fonction de votre sélection.

2 – Intégrer le code HTML pour mettre en  place la carte Google Maps

Maintenant, il ne vous reste plus qu’à mettre la ligne de code HTML générée par Google Maps dans la page sur laquelle vous souhaitée mettre votre carte fraichement générée :

• Toujours dans la fenêtre d’aperçu de votre carte, copiez le code HTML commençant par «
• Parcourez le code HTML de votre page web jusqu’à l’endroit où vous placerez la carte ; si vous êtes sur WordPress, vous devrez passer l’éditeur « texte » (plutôt que « visuel ») de votre article ou page.
• Collez la portion de code HTML
• Enregistrez votre fichier pour sauvegarder les modifications

• Voir le site

• Partager: