widget: Carte

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.

Pour plus d'informations sur l'ajout de widget, voir Ajouter widget.

Conseil

Pour plus d'informations sur widget et la widget bibliothèque,widget voir: Library and Overview.

Éditeur de contenu

Pour accéder à l'Éditeur de contenu, cliquez avec le bouton droit de la souris sur le site widget et sélectionnez Modifier le contenu.

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.

  • 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, sélectionnez l'option Utiliser le bouton sur les appareils (map-button-devices.png) à 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.

Rédacteur en chef de la conception

Pour accéder à l'éditeur de conception, cliquez avec le bouton droit de la souris sur l'élément, puis cliquez sur Modifier la conception.

Cliquez sur l'onglet de mise en page pour modifier le design de la carte qui apparaît sur votre site.

Pour obtenir des informations sur les options de design qui ne sont pas spécifiques à ce widget (la mise en page, le style et l'espacement, par exemple), consultez l'article Conception des widgets.

Intégrer une carte Google Map à l'aide d'un widget HTML

Pour intégrer une carte Google Maps à l'aide du widget HTML :

  1. Rendez-vous sur Google Maps.

  2. Recherchez l'adresse souhaitée.

  3. Cliquez sur le menu en haut à gauche, puis sur Partager ou intégrer la carte .

  4. Cliquez sur l'onglet Embed map.

  5. Copiez l'URL entre guillemets, après <iframe src =". Assurez-vous de copier l'intégralité de l'URL comprise entre les guillemets.

  6. 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.

  7. 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>

  8. Accédez au Mode développeur.

  9. Cliquez sur Site HTML/CSS, puis sur site.css.

  10. 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.