Comment intégrer Google Maps à votre site Web

Publié: 2022-05-15

Aider les clients ou les clients à trouver votre magasin dans le monde réel est essentiel pour maximiser vos ventes en personne. Vous pouvez ajouter votre entreprise à Google Maps à l'aide de Google My Business. Mais vous pouvez également intégrer Google Maps dans votre site Web - par exemple, votre page de contact.

C'est plus facile qu'il n'y paraît.

Intégrer Google Maps dans les sites Web est un moyen simple d'aider les consommateurs à localiser votre entreprise. Avec plus de 150 millions d'utilisateurs accédant à Google Maps chaque mois, vous souhaitez puiser dans cette base d'utilisateurs. Après tout, c'est un moyen incontournable de trouver des entreprises et des entreprises, que vous soyez un client, un client ou même un employé potentiel.

intégrer google map, intégrer google maps dans le site Web

Dans cet article, nous expliquerons comment intégrer Google Maps dans des sites Web, qu'il s'agisse d'un site d'entreprise ou d'un magasin local.

Boostez votre marketing ! Planifiez une consultation gratuite pour augmenter vos ventes avec SEO et PPC dès aujourd'hui !

Comment intégrer Google Maps dans les sites Web

Il existe deux manières différentes d'intégrer Google Maps dans un site Web : le code HTML ou une clé API.

Utilisation du code HTML

Google Maps a la fonctionnalité "Partager ou intégrer la carte" intégrée dans leur système. Vous utilisez le code HTML de la carte dans le code HTML de votre site Web pour créer un lien direct vers Google Maps sur la page.

  1. Accédez à google.com/maps.
  2. Recherchez l'emplacement que vous souhaitez intégrer et sélectionnez-le.
  3. Cliquez sur les trois lignes horizontales dans l'onglet de menu dans le coin supérieur gauche.
  4. Sélectionnez l'option "Partager ou intégrer la carte".

Vous pouvez utiliser le lien de partage pour envoyer ou partager le lien sur les réseaux sociaux, comme Facebook ou Twitter, ou d'autres plateformes compatibles.
Pour ajouter le lien vers votre site Web, cliquez sur l'onglet "Intégrer une carte".

  1. Décidez de la taille de la carte dans l'onglet déroulant de gauche du menu contextuel : Petite, Moyenne, Grande ou Taille personnalisée.
  2. Sélectionnez l'option "COPIER HTML" et collez-la dans la section HTML de votre site Web.
  3. Vous pouvez placer la carte où vous voulez sur votre page Web. Cependant, en intégrant une carte, vous acceptez de respecter les conditions d'utilisation de Google. Vous n'aurez pas non plus accès à toutes les fonctionnalités de Google Map dans une carte intégrée, telles que les informations de trafic en direct.

Blogs recommandés : Top 20 des idées prêtes à l'emploi pour augmenter les ventes et Qu'est-ce que le référencement ? Un guide du débutant pour l'optimisation des moteurs de recherche.

Utiliser une clé API pour intégrer Google Maps

Vous aurez besoin d'une certaine maîtrise du codage pour implémenter cette méthode.

Étape 1 : Générer une clé API

  1. Accédez à la section Google Maps de Google Cloud Platform.
    (Vous aurez besoin d'avoir des API activées lorsque vous configurez un projet)
  2. Dans le menu de gauche, sélectionnez "Identifiants".
  3. Cliquez sur "+ CRÉER DES IDENTIFIANTS".
  4. Sélectionnez "Clé API" dans le menu et copiez l'API qui apparaît (vous en aurez besoin plus tard).

Étape 2 : Créer du code pour rendre la carte fonctionnelle

  1. Décidez du code de style de carte pour votre page.
    <style>
    #map { largeur : 100 % ;

    hauteur : 400px ;

    couleur de fond : gris ;

    }

    </style>

  2. Ajoutez un script de carte avec les coordonnées de votre entreprise.
    <script> fonction initMap() {

    var macc = {lat : <latitude>, lng : <longitude>} ;

    var map = new google.maps.Map(

    document.getElementById('map'), {zoom : 15, centre : macc} );

    var marker = new google.maps.Market({position : macc, map : map});

    }

    </script>

Étape 3 : Ajouter un script Google dans le document HTML

  1. Ajoutez la clé API dans le script async ci-dessous, en remplaçant "YOUR_API_KEY".
    <script asynchrone
    src="https://maps.googleapis.com/maps/api/js?key=<YOUR_API_KEY>&callback=initMap">
    </script>
  2. Ajoutez le script dans le document HTML pour terminer.

Vous devez utiliser la fonction initMap(), car Google en a besoin pour initialiser et ajouter où la carte se charge. À l'intérieur de cette fonction, il doit contenir la latitude et la longitude de l'emplacement.

Une fois que vous avez terminé, vous avez une carte réactive prête à être utilisée par vos clients.

Blogs recommandés : Comment créer un entonnoir de marketing de contenu qui convertit et qu'est-ce que le copywriting ? Comment augmenter les ventes avec la rédaction numérique.

Pourquoi intégrer Google Maps à votre site Web ?

Peut-être avez-vous un objectif spécifique pour lequel vous souhaitez ajouter Google Maps. Si ce n'est pas le cas, voici quelques raisons pour lesquelles vous devriez intégrer Google Maps sur des sites Web.

Trouvez votre magasin

Toutes les entreprises locales doivent donner la priorité à l'inclusion d'un Google Maps intégré sur leur site Web. Les captures d'écran de Google Maps sont utiles, mais elles ne fournissent nulle part le niveau de détail d'une carte intégrée entièrement opérationnelle. Par exemple, un client peut faire défiler pour voir à quelle distance se trouve votre magasin de son domicile.

Pouvoir localiser votre magasin augmentera votre fréquentation, vos ventes et vos bénéfices en magasin. C'est un moyen simple de lier votre présence en ligne à votre entreprise dans le monde réel.

Blogs recommandés : Comment générer du trafic vers une nouvelle boutique Shopify, Idées de stratégie de notoriété de la marque pour développer votre entreprise et 5 idées de marketing en ligne efficaces pour les petites entreprises.

Ajoutez de la valeur à votre page de contact

Lister une adresse est une chose, mais votre client se dirigera uniquement vers Google Maps et effectuera une recherche de toute façon. Nous avons une règle en marketing : minimiser les étapes que le client doit suivre. Chaque clic ou recherche supplémentaire entraîne la perte de clients.

En ajoutant une application Google Maps intégrée, vous pouvez ajouter de la valeur à votre page de contact et faire gagner du temps à votre client. C'est essentiel si votre entreprise est un peu à l'écart.

Démontrer les itinéraires

Certaines entreprises sont là pour être utiles. Si vous vendez des chaussures de randonnée ou des hauts de course, vous voudrez peut-être recommander des promenades ou des courses à vos clients. (Cela fait un excellent article de blog.) Il n'y a pas de meilleur moyen d'afficher de telles informations qu'avec un itinéraire en surbrillance dans Google Maps.

Blogs recommandés : Qu'est-ce que le marketing numérique ? Les fondamentaux du numérique dans le marketing, les avantages de Google My Business et comment trouver un sitemap pour mon site Web.

Apprendre à intégrer Google dans un site Web est simple

Cela peut sembler un peu intimidant. Mais suivez le guide ci-dessus étape par étape et vous obtiendrez une carte parfaitement intégrée que vos clients apprécieront. C'est pratique et utile, et cela stimulera également votre entreprise. Cela vaut la peine d'essayer la technique API car elle vous donnera beaucoup plus de fonctionnalités que les autres options.

Bien sûr, si vous avez vraiment du mal, vous pouvez toujours contacter un expert pour vous aider. Nous avons de l'expérience dans la configuration de sites Web et l'intégration de Google Maps. Et nous sommes plus qu'heureux de vous aider.