Ajouter une carte Google Maps sur Divi sans API et gratuitement est un jeu d’enfant.

En effet, depuis 2018, Google demande de fournir un moyen de paiement. Si l’entreprise dépasse les quotas d’affichages, 28000 par jour, elle se verra prélever directement. Pour connaître les prix, vous pouvez consulter les tarifs directement en cliquant sur ce lien.

Première étape : Obtenir le code pour ajouter Google Maps sur Divi

Allez sur Maps, renseignez l’adresse souhaitée et cliquez sur l’onglet Partager.

Obtenir le code personnalisé

Cliquez ensuite sur Intégrer une carte > Menu > Lien personnalisé, copiez ensuite le code en cliquant sur  Copier le contenu HTML.

Selon vos besoins,  il est proposé différentes tailles de présentation du plan : petite, moyenne et grande. Le service vous offre également la possibilité de personnaliser la taille soi-même.

Copier le contenu HTML 

Deuxième étape : intégrer le code Maps sur Divi

Deuxième et dernière étape pour ajouter votre plan Maps sur Divi.

Allez sur la page où vous voulez qu’elle soit affichée, ajoutez le module code et copiez la balise.

Exemple de l’intégration de la Maps dans Divi.

Bonus : modifier la taille de la carte Maps sur Divi

La taille de la map ne vous satisfait pas, vous pouvez la modifier directement dans Divi. Cliquez sur le module Code où est intégré votre plan, descendez et modifiez la taille dans la propriété width et remplacez la valeur par 100%. Ainsi votre map prendra la taille de votre section ou de votre ligne.

Modification de la propriété width

À noter : pour que le plan Maps prenne la pleine largeur d’une ligne, allez dans l’onglet Style de la Ligne puis dans l’onglet Dimension. Modifiez les deux largeurs maximales en 100% et sélectionnez la pleine largeur des gouttières.

Modification de la taille de la Ligne

Et voilà vous avez un beau plan Maps sur votre site.

Si vous avez des questions, n’hésitez pas à commenter ci-dessous ou rejoindre notre groupe Facebook 😉