logo

 

 

Integration de la carte Google Maps sur un site web

Integration de la carte Google Maps sur un site web-panel consulting

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

 

Insertion du code HTML Google Maps dans l’éditeur WordPress

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
 
 

Commentaires
S'ABONNER A NOTRE NEWSLETTER

 

 

 

 

 

10 ans existence panel consulting.jpg-panel-consulting

 

ACTUALITE EN VIDEOS

Espace d'informations et de formations


miniature
  • Posté le 25-08-2018 à 15:08:32

Devkids-codage présente devkids tours 2018 Etape Abobo

 

promotion formation site web mois de noel_panel_consulting.jpg-panel-consulting

 

CEO

Events devkids-codage

affiche paysage devkids-codage les etape abobo.jpg - panel consulting

Nos videos devkids-codage

S5pJDhfJ5UI - panel consulting
Devkids-codage présente devkids tours 2018 Etape Abobo

Photos devkids-codage

Devkids-codage abobo-Saint-Marc-Akeikoi-Panel-Consulting 117-Devkids tours 2019.jpg - panel consulting

 

SAVEZ-VOUS QUE ?

Espace d'informations et de formations


10 ans existence panel consulting-merci.jpg - panel consulting
  • Posté le 10-01-2020 à 12:01:56

10 ans d'existence

 

NOS PARTENAIRES

logo ariel service.png
logoYD.png
YES CHALLENGE.jpg