widget Catégories : Entreprises
Affichez une carte avec les lieux de votre choix pour vos visiteurs. Utilisez le widget Plan pour afficher l'adresse de vos boutiques physiques ou d'un événement spécial. Vous pouvez également vous en servir pour indiquer à vos clients où trouver des places de stationnement.
Mapbox est le fournisseur de cartes par défaut pour le widget Map. Toutefois, vous pouvez faire de Google Maps le fournisseur de cartes par défaut pour tous les sites nouveaux et existants de votre compte. En plus de la carte widget, Google Maps deviendra la carte par défaut pour toutes les recherches d'emplacement et les cartes pour la bibliothèque de contenu et autres widget.
Toutes les données de localisation de Mapbox sont enregistrées et appliquées à Google Maps. Cela vous évite d'avoir à configurer à nouveau des localisations.
Notez que cette fonctionnalité ne peut être activée que par les membres du personnel autorisés à utiliser les paramètres professionnels.
Pour définir Google Maps comme votre fournisseur de cartes par défaut :
-
Dans votre compte Google Maps, générez une clé API. Pour savoir comment générer une clé API, consultez la documentation de Google. Nous vous recommandons de consulter les règles d'utilisation et de facturation de Google.
-
(Facultatif) Si vous avez configuré votre compte Google de manière à ce que la clé API ne puisse être utilisée que sur des sites Web spécifiques, vous devez ajouter duda.co, le domaine de votre site et, le cas échéant, les domaines en marque blanche à la liste des sites Web autorisés dans votre compte Google. Il est important d'utiliser le format suivant pour les domaines tu :
*.duda.co/* -
Dans votre tableau de bord, cliquez sur votre avatar dans le coin supérieur droit et sélectionnez Compte.
-
Sur la page Paramètres du compte, descendez jusqu'à la section Intégration de Google Map et cliquez sur Configurer.
-
Collez votre clé API dans le champ, puis cliquez sur Appliquer à tous les sites. Google Maps devient ainsi la carte par défaut pour tous les sites existants et nouveaux de votre compte.
À tout moment, vous pouvez désactiver Google Maps et revenir à Mapbox. Toutes les données de localisation de Google Maps sont sauvegardées et automatiquement appliquées à Mapbox lors du changement.
Options de configuration de la carte
-
Saisissez l'adresse de votre entreprise dans le champ dédié.
-
Sélectionnez l'adresse dans la liste déroulante qui s'affiche.
Remarque
Si votre adresse ne s'affiche pas dans la liste déroulante, cela signifie que la base de données HERE utilisée par la Website Builder ne contient pas l'adresse. Pour envoyer ou corriger l'adresse, contactez HERE Map Creator.
Si vous utilisez Google Maps comme fournisseur par défaut, consultez la documentation de Google, Ajouter un lieu manquant à Google Maps.
-
-
Vous pouvez choisir d'afficher un bouton de carte au lieu d'une image de carte.
-
Pour afficher un bouton de carte sur des appareils spécifiques dans l'éditeur classique, sélectionnez l'option Utiliser le bouton sur les appareils (
) à l'endroit où vous souhaitez que le bouton apparaisse. Si aucun dispositif n'est choisi, l'image de la carte s'affiche.
-
Dans l'Éditeur 2.0, le bouton peut être activé pour tous les appareils. Pour activer le bouton, cliquez sur l'option Définir comme bouton sur tous les appareils.
-
-
Saisissez le texte que vous souhaitez voir apparaître sur le bouton dans le champ Texte sur le bouton prévu à cet effet.
-
Fenêtre d'information sur l'emplacement (fenêtre d'information pour le marqueur de carte). Pour afficher une fenêtre contextuelle d'informations sur l'emplacement dans le widget de la carte :
-
Saisissez un titre et une description pour la fenêtre contextuelle.
-
Sélectionnez l'affichage de la fenêtre contextuelle sur hover, au clic ou toujours dans le menu déroulant de l'affichage de la fenêtre contextuelle.
-
Pour intégrer une carte Google Maps à l'aide du widget HTML :
-
Rendez-vous sur Google Maps.
-
Recherchez l'adresse souhaitée.
-
Cliquez sur le menu en haut à gauche, puis sur Partager ou intégrer la carte .
-
Cliquez sur l'onglet Embed map.
-
Copiez l'URL entre guillemets, après <iframe src =". Assurez-vous de copier l'intégralité de l'URL comprise entre les guillemets.
-
Naviguez vers votre site et, dans le panneau de gauche, cliquez sur widget, puis faites glisser le HTML widget dans une ligne ou une colonne.
-
Utilisez le code d'intégration suivant et ajoutez l'URL copiée à partir de Google Maps entre les guillemets qui suivent iframe src= :
<div class="embed-container"><iframe src=" " frameborder="0" allowfullscreen></iframe></div> -
Accédez au Mode développeur.
-
Cliquez sur Site HTML/CSS, puis sur site.css.
-
Intégrez les CSS suivants dans cette section :
.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }La taille de la carte s'adaptera aux différents affichages des appareils. Si vous utilisez le code d'intégration normal de Google Maps, la taille du widget de la carte sera la même sur tous les appareils et sera coupée sur un affichage mobile.