Comment insérer et afficher Google Maps sur un site Web?

Vous est-il arrivé de vouloir insérer Google Maps sur un site Web et vous ne savez pas comment faire ? Ne vous inquiétez pas, c’est un processus simple et rapide que vous apprendrez à développer ici.

Il est très courant que lors de la publication d’informations contenant une adresse, nous sautions pour la rechercher manuellement sur Google Maps, ce qui génère parfois de la confusion ou des erreurs.

Qui n’a pas découvert que vous avez recherché la mauvaise adresse et que vous vous êtes retrouvé au mauvais endroit. Eh bien, ce ne sera plus un problème. Avec cette étape par étape, vous pouvez insérer et afficher Google Maps avec l’adresse que vous souhaitez sur votre site Web.

C’est aussi simple que de mettre des étiquettes sur les adresses des lieux dans Google Maps ou de créer, ajouter et organiser des légendes dans Google Maps.

À partir de maintenant, il ne sera plus un problème de montrer aux visiteurs de votre site où se trouve le nouveau parc que vous avez visité et aimé. Ou peut-être que vous possédez une entreprise et que vous souhaitez que votre adresse soit répertoriée pour que tout le monde puisse vous rendre visite.

L’utilisation est à vous. Nous nous chargeons de vous montrer la meilleure façon de générer, insérer et afficher la carte dont vous avez besoin sur votre site Web.

Générer la carte à partir de Google Maps

Afin d’insérer Google Maps sur un site Web, par exemple, sur des plates-formes telles que WordPress, nous devons rechercher dans Maps l’adresse que nous voulons afficher en premier lieu sur notre page. Bien sûr, vous devez d’abord vous connecter à Google lors de l’ouverture de Chrome.

Après avoir localisé l’adresse, nous sélectionnons l’option «Partager» dans laquelle nous verrons deux onglets. Nous choisirons celui qui correspond à notre désir «Incorporer une carte».

Étant dans cet onglet, nous aurons un aperçu de la carte avec l’adresse que nous recherchons en surbrillance.

Vous pourrez vous rendre compte que la carte est modifiable, c’est-à-dire que vous pouvez déplacer le point focal du côté que vous voulez qu’il soit perçu. De cette façon, il sera visible après son insertion sur notre site Web.

En outre, vous aurez la possibilité de choisir entre différentes tailles de carte, afin de pouvoir sélectionner celle qui vous convient le mieux. Vous pouvez même choisir la taille personnalisée, dans laquelle vous devez entrer les valeurs.

Ayant la carte comme nous le souhaitons, nous copierons les informations que nous trouverons dans la partie inférieure de la fenêtre. Il s’agit du code individuel de la carte.

Comment insérer la carte depuis Google Maps

En ayant le code de la carte, nous commencerons à insérer Google Maps sur un site Web. Dans ce cas, nous vous montrerons étape par étape comment le faire dans WordPress, bien que cela soit très similaire dans d’autres gestionnaires de contenu (CMS).

Nous irons au poste où nous voulons avoir la carte, dans la partie édition. En haut, nous passons au mode «HTML».

Dans cette option, nous allons coller l’adresse que nous avons extraite de la carte. Là où nous voulons que la carte soit vue.

Après cela, si nous revenons au mode «Visuel», il sera noté où nous avons inséré la carte. N’oubliez pas de sauvegarder le message.

Et voilà, la carte est correctement incluse dans notre publication. La meilleure chose à faire est qu’il s’agit d’une carte interactive, qui comprend toutes les options de Maps elle-même .

Générer une carte sans CMS

Si vous souhaitez générer une carte qui ne sera pas utilisée sur les sites Web avec des gestionnaires de contenu, le processus est un peu moins simple.

Nous devons créer un dossier, dans lequel nous trouverons un «Document texte» (.txt) avec le nom souhaité.

Ensuite, nous ouvrirons le .txt avec «l’éditeur de code» de préférence. Un HTML5 doit être généré, suivi d’un HTLM2.5.

En conséquence, nous placerons le code de la carte dans le «Corps». Et nous donnons «Save».

Lors de l’ouverture de ce document dans un navigateur, nous verrons la carte entièrement interactive et dans un onglet individuel.

Nous pouvons insérer ou partager ceci où nous voulons et chaque fois qu’il est exécuté dans un navigateur, il nous montrera la carte avec l’adresse et les caractéristiques que nous avons déjà configurées.