Comment ajouter une carte Google dans Gutenberg WordPress gratuit en 2024

L'ajout de Google Maps à votre site web permet aux visiteurs de trouver facilement votre emplacement et peut également améliorer l'affichage de votre site dans les résultats de recherche. Cela se traduit par une augmentation du trafic et des clients potentiels.

Dans cet article, nous allons vous expliquer comment ajouter une carte Google dans un site WordPress Gutenberg, afin d'améliorer à la fois la façon dont les utilisateurs interagissent avec votre site et ses performances dans les recherches.

C'est parti !

Pourquoi utiliser Google Maps dans WordPress ?

Google Maps est très important pour un site WordPress, c'est l'application de navigation la plus populaire dans la plupart des plateformes. Voyons comment nous pouvons en tirer profit.

Le référencement local de votre site sera amélioré

• Si vous ajoutez Google Maps à votre site WordPress, le moteur de recherche Google peut facilement obtenir toutes vos coordonnées, ce qui améliorera votre référencement local.
• Avec 1 milliard de personnes effectuant chaque semaine des recherches à l'aide de Google Maps, le référencement local peut aider les gens à trouver facilement votre site.

Des directions faciles à suivre : 

• Les gens établiront des itinéraires en voiture, à pied, en transport en commun ou à vélo pour se rendre à votre entreprise.

Interactivité accrue : 

• Si votre carte est attrayante, les internautes interagiront davantage avec votre site web et, au fur et à mesure que les internautes interagiront, la confiance s'installera entre eux.

Une meilleure expérience pour l'utilisateur :

• Les cartes peuvent ajouter de la souplesse à votre site, car les gens peuvent trouver votre entreprise rapidement, ce qui leur permet de vous localiser plus facilement.

Localisation de plusieurs magasins :

• Si votre entreprise possède plusieurs succursales dans différents endroits, vos clients peuvent la trouver facilement grâce aux cartes intégrées à vos sites web. Votre entreprise n'aura donc plus de limites et vous pourrez la développer davantage.

C'est pour ces raisons que vous devez ajouter Google Maps à votre site WordPress. Voyons maintenant comment ajouter Google Maps à WordPress.

Comment ajouter une carte Google dans Gutenberg WordPress Free

Si vous souhaitez ajouter Google Maps à votre site web, vous avez d'abord besoin d'une clé API. Depuis le 11 juin 2018, Google a besoin d'une clé API pour que Google Maps fonctionne correctement. Cette clé API vérifie et autorise les demandes adressées à la plateforme Google Maps. Cela permet de s'assurer que votre utilisation est suivie et facturée correctement.

Comment créer une clé API pour Google Maps ?

Pour utiliser Google Maps sur votre site WordPress, vous devez :

S'inscrire à un Google Cloud Platform en cliquant sur le bouton Commencer gratuitement bouton.

Créez un projet et cliquez sur le bouton Accepter et continuer bouton.

Cliquez sur les Démarrage libre pour créer votre compte de facturation et faire vérifier vos informations de facturation.

Répondez ensuite à chaque question, cliquez sur continuer, puis appuyez sur le bouton soumettre bouton.

Votre clé API est générée.

Pour charger la carte et fournir les fonctionnalités requises, l'API JavaScript de Google Maps utilise cette clé API. Vous ne pouvez pas utiliser Google Maps sur votre site sans clé API.

Bien, maintenant nous allons ajouter Google Maps à notre site WordPress pour cela nous avons besoin d'un bloc Gutenberg pour les cartes gratuitement.

Comment installer ZoloBlocks ?

Nous allons donc installer ZoloBlocks

Aller dans le tableau de bord de WordPress

Naviguez maintenant vers Plugins -> Ajouter un nouveau plugin.

Tapez ZoloBlocks dans la recherche de plugin et cliquez sur le bouton Installer maintenant.

Après l'installation, activer le plugin.

Vous serez accueilli par la page de bienvenue de ZoloBlocks.

Allez maintenant dans l'onglet Blocs et vérifiez si votre bloc Google Map est activé ou non.

Après avoir activé le bloc Google Map, accédez à l'onglet Paramètres de l'API et cliquez sur l'icône de modification de Google Map.

Placez maintenant la clé API que vous avez obtenue de Google Cloud dans le champ API et cliquez sur Enregistrer les modifications.

Vous avez configuré Google Maps avec succès dans WordPress.

Il est temps de placer la carte sur un article ou une page.

Nous pouvons placer la carte sur la page Contactez-nous. C'est l'endroit le plus approprié pour rechercher votre adresse et vos coordonnées.

Allez dans le tableau de bord de WordPress et naviguez vers Pages -> Toutes les pages.

Recherchez maintenant la page Contactez-nous et cliquez sur Editer.

Cliquez maintenant sur le bouton + icône, type Google sur la recherche de bloc, et cliquez sur le bloc Carte.

Wow, vous venez d'ajouter les cartes, vérifions les paramètres généraux.

Vous pouvez modifier le nom du lieu marqué, sa longitude et sa latitude et, si vous disposez d'un code HTML, vous pouvez le coller dans la description du marqueur.

Comment ajouter plusieurs lieux sur Google Maps dans WordPress ?

Vous pouvez ajouter d'autres emplacements en utilisant le bloc ZoloBlocks Google Map.

Sous Paramètres généraux, vous trouverez une option intitulée Autres emplacements.

Cliquez sur le bouton + dans le coin droit.

Tapez le nom du lieu et il apparaîtra sur la carte avec la marque.

Vous pouvez activer ou désactiver n'importe quel élément de l'interface utilisateur de votre carte à partir de l'option Interface utilisateur de la carte.

Vous pouvez modifier les paramètres de la carte sous l'option Paramètres.

Changez l'affichage de la carte et la langue à partir de là.

Vous pouvez modifier la hauteur de la carte et le rayon de la bordure dans l'onglet Style.

Vous pouvez modifier la couleur et la typographie du marqueur à partir de l'option Info Marqueur.

Enfin, vous pouvez ajuster les paramètres de l'ensemble du bloc et ajouter des feuilles de style CSS supplémentaires à partir de l'onglet Extra.

Lorsque tous vos paramètres sont appliqués, il vous suffit de cliquer sur le bouton Mettre à jour en haut de la page et de visualiser les modifications.

Wow, votre carte s'affiche parfaitement.

La marche à suivre n'est-elle pas si simple ?

Si vous rencontrez encore des problèmes, vous pouvez vérifier le fichier la documentation pour plus d'informations.

Dernières réflexions

Vous avez parcouru un long chemin et appris à ajouter une clé Google Cloud API pour intégrer des cartes sur WordPress. Mais surtout, vous avez appris Comment ajouter une carte Google dans Gutenberg WordPress gratuit using ZoloBlocks.  I hope you won’t regret following the walkthrough as you gather all the knowledge about map customization.

Grâce au plugin ZoloBlocks, l'ajout d'une carte est très facile dans votre WordPress. Vos visiteurs vous trouveront facilement grâce aux cartes. Faites savoir aux gens où se trouve votre entreprise en utilisant ZoloBlocks.