Comment faire une carte Google avec plusieurs broches dans WordPress

L'ajout d'une carte à votre site Web peut aider vos visiteurs à trouver facilement votre entreprise ou vos emplacements d'événements. Si votre entreprise a plus d'un emplacement, vous voudrez peut-être les montrer tous sur la même carte. C'est là que l'utilisation de plusieurs épingles sur une carte Google pourrait devenir utile.

Si votre site Web est construit avec Elementor, vous n'aurez pas à prendre beaucoup de tracas pour ajouter plusieurs broches sur votre google map. Au lieu de cela, vous pouvez facilement en ajouter autant que vous le souhaitez. Le processus est assez simple, même pour les débutants.

Dans cet article, nous couvrirons un tutoriel détaillé sur la façon de créer une carte Google avec plusieurs broches dans WordPress avec Elementor. Mais avant cela, nous couvrirons quelques mots sur pourquoi et quand vous devriez utiliser Google Maps avec plusieurs épingles sur vos sites Web WordPress.

Pourquoi utiliser Google Maps avec plusieurs broches sur votre site WordPress

L'utilisation de Google Maps avec plusieurs épingles peut améliorer votre site Web à bien des égards. Il ne s'agit pas seulement de montrer des emplacements. Il peut aider les utilisateurs à établir la confiance et à rendre votre site plus utile car ils peuvent facilement trouver vos magasins. Voici quelques principales raisons pour lesquelles vous devriez le considérer.

1. Montrez tous vos emplacements en un seul endroit

Si votre entreprise a plusieurs succursales, magasins ou bureaux, plusieurs épingles peuvent vous aider à les afficher sur une seule carte. Cela facilite les visiteurs de voir chaque emplacement en un coup d'œil sans basculer entre différentes cartes ou pages.

2. Aidez les utilisateurs à trouver l'endroit le plus proche

Lorsque les utilisateurs voient tous les emplacements sur une carte, ils peuvent rapidement trouver celui qui est le plus proche d'eux. Cela peut améliorer leur expérience et les aider à agir plus rapidement, comme visiter votre magasin ou prendre rendez-vous.

3. Gagnez du temps pour les visiteurs

Au lieu de répertorier chaque adresse une par une en texte brut, vous pouvez les montrer visuellement avec des épingles. Cela fait gagner du temps pour vous et vos visiteurs. Cela rend également votre site plus professionnel et moderne.

4. booster le référencement local avec les données de localisation

Google Maps peut aider avec le référencement local de votre site Web. Lorsque vous ajoutez des adresses réelles à votre carte, il indique aux moteurs de recherche de vos emplacements commerciaux. Cela peut aider votre site à apparaître dans les résultats de recherche locaux. Explorez comment améliorer le référencement local avec HappyAddons.

5. Rendez votre site plus interactif

Une carte avec plusieurs épingles semble plus interactive et dynamique que le texte tout simplement. Les visiteurs peuvent zoomer, cliquer sur les épingles et explorer la carte. Cela rend votre site plus engageant et plus convivial.

6. parfait pour les entreprises basées sur les services ou multi-branches

Si vous dirigez une chaîne de restaurants, de cliniques, de magasins ou de points de livraison, plusieurs épingles aident à expliquer clairement votre portée. Comme déjà dit ci-dessus, cela renforce la confiance et aide les utilisateurs à choisir l'endroit le plus proche.

Prérequis pour faire une carte Google avec plusieurs broches avec Elementor

Soyons clairs au début. Elementor a un widget intégré appelé Google Map . Mais ses fonctionnalités sont très limitées. Vous ne pouvez pas ajouter plusieurs broches à la carte à l'aide de ce widget par défaut. Donc, pour ce faire, vous aurez besoin d'un addon supplémentaire.

Une excellente option est HappyAddons . Il propose un widget appelé Google Maps avancé , qui vous permet de créer et d'ajouter facilement plusieurs broches à votre carte sans tracas.

Ainsi, au total, vous avez besoin des outils suivants sur votre site pour ce tutoriel.

• Élémentor
• Happyaddons
• Happyaddons pro

HappyAddons Pro est requis car la carte Google avancée est un widget premium du plugin. Une fois qu'ils sont installés et activés sur votre site, commencez à suivre le tutoriel comme mentionné ci-dessous. Explorez tous les autres widgets de HappyAddons.

Comment faire une carte Google avec plusieurs broches dans WordPress: tutoriel étape par étape

Dans cette section, nous expliquerons étape par étape comment créer une carte Google avec plusieurs broches dans WordPress avec Elementor et HappyAddons Plugins. Nous décorerons également cette section avec des captures d'écran nécessaires, afin que vous puissiez comprendre le processus complet. Continuez à lire!

Étape 01: ouvrez une page et recherchez le widget avancé de la carte Google

Ouvrez le message ou la page où vous souhaitez créer la carte Google avec plusieurs broches. Trouvez le widget Advance Google Map sur le panneau Elementor. Faites glisser et déposez-le sur le canevas Elementor.

Étape 02: Obtenez la clé de l'API Google

Une fois le widget ajouté à la toile, il vous sera demandé de configurer des informations d'identification pour afficher la carte Google. Pour commencer, cliquez sur l'option Identials dans la section Paramètres généraux du panneau.

Vous serez emmené dans la section des informations d'identification de HappyAddons dans le backend du site Web. Trouvez l'option Google Map . Ensuite, appuyez sur l'option Get API .

Vous arriverez à la page Cloud Google.

Maintenant, vous devez trouver «Maps JavaScript API». Pour cela, tapez API JavaScript Maps dans la zone de recherche. Une fois que l'option apparaît, cliquez dessus .

Après être venu sur la page API JavaScript Maps, activez l'option .

Appuyez sur le bouton Accept & Continuer . Avant cela, vous pouvez sélectionner votre pays. Nous l'avons brouillé pour notre cas.

La clé de l'API Google n'est pas techniquement gratuite. Vous devez compléter vos informations de facturation pour obtenir l'API.

Remarque (comment il est gratuit): Bien qu'il ne soit pas techniquement gratuit, vous recevrez des jetons équivalents à 200 $ par mois sans frais . Avec ce jeton, votre google map peut être chargée ou visualisée jusqu'à 28 000 fois . Ce n'est que si cette limite de vue / charge est franchie que votre carte sera facturée.

Après cela, vous serez fourni avec une popup. Vous devez donner des informations sur votre entreprise où cette carte sera utilisée. Une fois terminé, cliquez sur le bouton Soumettre dans le coin inférieur droit de la fenêtre contextuelle.

La touche API Google Map apparaîtra instantanément sur votre écran avec une nouvelle fenêtre contextuelle. Copiez la clé API .

Revenez à l'option HappyAddons Google API Key et collez votre code là-bas. Appuyez sur le bouton Enregistrer les modifications à la fin.

Maintenant, venez sur votre toile Elementor et actualisez / rechargez-le. La carte Google apparaîtra sur la toile.

Vérifiez comment créer une chronologie dans WordPress avec Elementor.

Étape 03: Ajouter plusieurs broches à la carte

Par défaut, une seule broche s'affiche sur la carte. Pour ajouter et afficher plus d'épingles à la carte, développez la section Marqueur de carte sur le panneau.

Une fois la section de marqueur de carte élargie, vous pouvez ajouter autant d'épingles que vous le souhaitez en cliquant sur le bouton + Ajouter l'élément .

Maintenant, en plaçant des valeurs pour la latitude et la longitude, vous pouvez définir avec précision les broches avec précision pour chaque endroit.

Étape 04: configurer les paramètres de la carte

De la même manière, développez la section Paramètres de carte .

Vous trouverez beaucoup d'options dans cette section.

Maintenant, vous explorez gentiment chaque option en activant et en désactivant comment ils fonctionnent afin que vous puissiez enfin rester avec ceux qui répondent aux besoins de conception.

Apprenez à créer une galerie d'images de défilement automatique dans WordPress.

Étape 05: styliser le widget avancé de la carte Google

Lorsque tous les paramètres et pièces de contenu sont terminés, venez à l' onglet Style . De là, vous pouvez personnaliser la hauteur, la largeur, le type de bordure, le rayon de bordure et plus d'options.

De la même manière, développez également d'autres options et faites les personnalisations nécessaires car vous souhaitez modifier l'apparence des épingles.

Étape 06: Aperçu de la conception

Lorsque la conception est terminée, avant de la publier en ligne, prévisualisez-la pour voir si une correction ou une modification est requise. Vous pouvez voir que le widget fonctionne bien de notre côté dans le clip vidéo ci-dessous.

Ainsi, vous pouvez créer une carte Google avec plusieurs broches dans WordPress avec Elementor.

Conseils avancés pour la carte Google avec plusieurs broches

Une fois que vous avez ajouté plusieurs épingles à votre Google Map, vous pouvez faire plus de choses pour améliorer la carte pour vos visiteurs et votre site Web. Ces conseils avancés vous aideront à rendre votre carte plus professionnelle, à améliorer l'expérience utilisateur et même à soutenir vos efforts de référencement locaux.

1. Utilisez des images personnalisées au lieu des icônes

Au lieu de la broche rouge par défaut, essayez d'utiliser des icônes ou des images personnalisées pour chaque emplacement. HappyAddons vous permet de le faire à partir de l'onglet de contenu> Section de marqueurs de carte. Des images et des icônes personnalisées peuvent rendre votre carte plus claire visuellement et attrayante.

2. Paramètres de zoom et central

Ajustez le niveau de zoom et le centre de votre carte pour afficher correctement toutes les broches. Si certaines broches sont éloignées, assurez-vous que le niveau de zoom est suffisamment large pour que tous soient visibles lorsque la carte se charge. Cela donne aux utilisateurs un aperçu complet sans avoir besoin de déplacer la carte manuellement.

3. Rendez-le adapté aux mobiles

Vérifiez toujours à quoi ressemble votre carte sur les appareils mobiles. Assurez-vous qu'il se charge rapidement, les broches sont cliquables et que les boîtes d'information sont lisibles sur les petits écrans. Une carte qui fonctionne bien sur le bureau et le mobile satisfera plus d'utilisateurs.

4. Intégrer les cartes sur les pages de contact ou de localisation

Ne laissez pas simplement votre carte sur une page. Vous pouvez réutiliser la même carte en l'intégrant sur d'autres pages comme «Contactez-nous», «nos emplacements» ou les pages «visitez-nous». Cela aide les utilisateurs à trouver le bon endroit où qu'ils se trouvent sur votre site.

Apprenez à créer une page Web dynamique dans WordPress avec Elementor.

Conclusion

Faire une carte Google avec plusieurs épingles peut être une étape simple ou une partie de votre conception Web, mais elle peut avoir une impression durable. Non seulement cela peut aider les visiteurs à trouver vos emplacements, mais aussi à augmenter le score SEO local et à rendre votre site Web plus professionnel.

Avec l'aide des plugins Elementor et HappyAddons, vous pouvez les ajouter facilement à votre site Web sans trop de tracas. C'est si simple que même les débutants peuvent le faire simplement en suivant le tutoriel couvert ci-dessus. Si vous avez encore des questions sans réponse, faites-le nous savoir via la zone de commentaire ci-dessous.

Nous vous répondrons très bientôt avec des réponses viables. Merci d'être avec nous jusqu'à la fin. Faites-nous savoir quel sujet vous voulez que nous couvrions dans le prochain post.