Depuis juin 2016, Google n’autorise plus de créer des cartes « Google Map » à la volée.
Vous êtes obligé de créer une clef API afin d’affiché une carte.
Créer une clef API
Pour ce faire, rendez-vous sur le site Google Developers
https://developers.google.com/?hl=fr
Et connectez-vous à votre compte ou créez en un.
Une fois cela fait, rendez-vous dans le menu « Google Map API » et cliquez sur « Démarrer ».
Ensuite cliquez sur « Obtenir une clé ».
Après avoir validé une fenêtre de dialogue, vous arriverez sur la page de création de projet.
Vous cliquerez sur continuer après avoir choisi « Créer un projet ».
Après quelques instants, vous aurez la possibilité d’obtenir votre clé.
Vous pourrez nommer votre clé : remplacer le nom « Clé API 1 » par celui de votre choix.
Vous devrez ensuite, restreindre l’accès à cette clé en choisissant le référent http (sites web)
url.com
url.com/*
*.url.com/*
Où vous remplacez url.fr par votre adresse
Par exemple :
afi-aveyron.fr
afi-aveyron.fr/*
*.afi-aveyron.fr/*
Cliquez ensuite sur « enregistrer » et vous aurez une boite de dialogue qui vous donnera le précieux sésame.
Activer Google Maps Javascript Api and Javascript Geocoding Api
Vérifier que ces deux options sont activées.
Cliquez sur « Bibliothèque »
et dans « API Google Maps, cliquez tout d’abord sur :
- Google Maps JavaScript API et activer le service si ce n’est déjà fait.
- Puis sur Javascript Geocoding Api et activer le service si ce n’est déjà fait
Une fois cela réalisé, vous pouvez afficher votre carte Google sur votre site.
Exemple avec le thème DIVI
Je vous propose un exemple avec le thème DIvi mais le procédé est le même pour toutes les extensions « Carte » : vous devez renseigner la clé API dans les options soit de l’extension soit du thème.
Renseignez la clé API
Pour afficher une carte avec le thème Divi, vous devez renseignez votre clé API dans les «options du Thème.
Copier votre clé API dans « le champs Google API Key.
Une fois cela réalisé, vous pourrez créer une carte sur une page.
Création d’une carte avec le module Map
Vous mettrez en place le module carte dans le Divi Buider
et tout d’abord renseigner la vue générale de carte (ici Rodez).
Puis vous « Ajouterez une nouvelle épingle », en choisissant :
- Titre
- Votre adresse en cliquant sur Trouvez
- Des informations complémentaires dans le champs texte.
Après avoir enregistré, votre carte sera visible.
