Pour un café, un cabinet, un studio ou un stand de marché, la page accessible depuis le lien du profil doit avant tout aider les visiteurs à venir sur place. Digily Link propose 3 méthodes, selon votre forfait et selon que vous souhaitez afficher une carte ou proposer un bouton qui lance directement la navigation.
Option 1. Un bouton d'itinéraire qui ouvre l'application Maps
Cette méthode fonctionne avec tous les forfaits, y compris Free, et c'est celle qui répond le mieux aux attentes de la plupart des visiteurs. Sur un téléphone, personne n'a envie de zoomer sur une carte avec les doigts. Les utilisateurs appuient sur "Obtenir l'itinéraire" et s'attendent à ce que la navigation démarre.
- Ouvrez Google Maps, recherchez votre établissement, appuyez sur Partager, puis copiez le lien.
- Dans le tableau de bord, créez un lien court en utilisant cette adresse comme destination, puis activez "auto open app on mobile". Digily Link reconnaît les liens Google Maps et Waze. Sur un téléphone où l'application est installée, le lien court ouvre donc directement la navigation. Le guide consacré aux liens profonds explique l'intérêt de ce fonctionnement.
- Ajoutez un bloc de lien à votre page, collez le lien court et donnez-lui le libellé "Obtenir l'itinéraire".
Comme le bouton renvoie vers un lien court, chaque clic est comptabilisé dans les statistiques. Vous pouvez également modifier la destination si votre établissement déménage.
Option 2. Une carte intégrée avec le bloc iframe
Le bloc iframe est disponible avec les forfaits Starter et Pro. Il permet d'afficher la carte directement sur la page.
- Dans Google Maps, recherchez le lieu, ouvrez le menu Partager, puis sélectionnez l'onglet "Intégrer une carte".
- Copiez le code HTML fourni par Google. Seule l'adresse placée dans src="..." est nécessaire. Elle commence par https://www.google.com/maps/embed. Si vous préférez isoler facilement cette adresse, collez l'extrait complet dans l'Analyseur d'URL.
- Ajoutez un bloc iframe à votre page, collez cette adresse comme URL, puis définissez une hauteur d'environ 300 pixels.
Placez le bouton d'itinéraire de l'option 1 juste sous la carte. La carte indique où vous vous trouvez, tandis que le bouton aide les visiteurs à s'y rendre.
Option 3. Du HTML personnalisé pour une carte responsive
Le bloc HTML personnalisé est proposé avec le forfait Pro. Il vous donne un contrôle total, notamment pour créer une carte qui conserve ses proportions sur toutes les tailles d'écran. Collez le code suivant dans le bloc, puis remplacez YOUR_EMBED_URL par l'adresse obtenue dans l'onglet "Intégrer une carte".
<div style="position:relative;padding-bottom:56.25%;height:0;overflow:hidden;border-radius:12px"><iframe src="YOUR_EMBED_URL" style="position:absolute;top:0;left:0;width:100%;height:100%;border:0" loading="lazy" allowfullscreen referrerpolicy="no-referrer-when-downgrade"></iframe></div>
La valeur padding-bottom définit le format. 56,25 % produit un rectangle 16:9, 75 % une carte plus carrée au format 4:3 et 100 % un carré. L'attribut loading="lazy" évite que la carte ralentisse la page avant que le visiteur ne fasse défiler le contenu jusqu'à elle. Si vous collez du code provenant d'une autre source, nettoyez-le d'abord avec le Minificateur HTML afin qu'un saut de ligne indésirable ne perturbe pas le bloc.
Quelle option choisir
| Votre objectif | Solution | Forfait |
|---|---|---|
| Lancer la navigation en un geste | Bouton d'itinéraire avec ouverture dans l'application | Free et forfaits supérieurs |
| Afficher une carte sur la page | Bloc iframe | Starter et Pro |
| Personnaliser le format et le style de la carte | Bloc HTML personnalisé | Pro |
| Présenter plusieurs adresses | Un titre et un bouton d'itinéraire par lieu, ou une carte Google My Maps personnalisée intégrée avec l'option 2 ou 3 | Selon les blocs utilisés |
Conseils pour les commerces et entreprises de proximité
- Ajoutez le code postal dans un bloc de paragraphe au-dessus de la carte pour les personnes qui préfèrent le saisir dans leur propre application.
- Ajoutez le bloc d'horaires d'ouverture, disponible avec le forfait Free, afin que les visiteurs sachent s'ils peuvent partir tout de suite.
- Limitez-vous à une carte par page. Deux cartes intégrées doublent le temps de chargement pour un bénéfice minime.
- Imprimez un QR code menant vers la page pour votre vitrine et vos prospectus. Vous trouverez un exemple de mise en page pour un établissement dans le guide du lien en bio pour les petites entreprises.
- Testez le bouton d'itinéraire depuis Instagram sur un iPhone et un téléphone Android. Le Vérificateur de redirection d'URL indique le comportement du lien court sur un ordinateur.
Boutiques éphémères, marchés et événements
Un stand qui change d'emplacement chaque week-end n'a pas besoin d'une nouvelle carte à chaque fois. Conservez un bouton d'itinéraire pointant vers un lien court, puis modifiez sa destination le vendredi pour indiquer l'emplacement du week-end. L'adresse de la page, le QR code imprimé sur la bannière et le lien du profil restent identiques. Avec les forfaits Starter et Pro, le lien court peut aussi être programmé. L'adresse du samedi peut ainsi être remplacée par celle du dimanche à minuit, sans intervention manuelle. Ajoutez un bloc de paragraphe avec les dates et le code postal pour les personnes qui souhaitent s'organiser à l'avance.
Apple Maps et Waze
L'ouverture dans l'application reconnaît les adresses Google Maps et Waze. Pour les utilisateurs d'iPhone qui préfèrent Apple Maps, un lien classique vers maps.apple.com contenant l'adresse ouvre Apple Maps sur un iPhone et une carte web sur les autres appareils. Les liens d'Apple fonctionnent ainsi sans réglage particulier. Deux boutons, "Google Maps" et "Apple Maps", couvrent presque tous les téléphones en France, et le nombre de clics vous indiquera celui que vos visiteurs utilisent réellement.
Questions fréquentes
Faut-il une clé API Google Maps ?
Non. Le code fourni par l'option "Intégrer une carte" et le lien de partage sont gratuits et ne nécessitent aucune clé. Une clé API est uniquement nécessaire aux développeurs qui créent leur propre application cartographique.
Peut-on afficher plusieurs repères sur la même carte ?
Créez une carte personnalisée dans Google My Maps avec tous vos emplacements, partagez-la publiquement, puis utilisez son adresse d'intégration dans le bloc iframe ou le bloc HTML personnalisé.
Une carte intégrée ralentit-elle la page ?
Un peu, c'est pourquoi le code ci-dessus utilise le chargement différé. Sur une page destinée à conduire les visiteurs jusqu'à votre établissement, le bouton d'itinéraire reste plus important que la carte elle-même.
Peut-on ajouter Google Maps avec le forfait Free ?
Oui pour le bouton d'itinéraire. Le bloc iframe nécessite Starter et le bloc HTML personnalisé nécessite Pro. La page des forfaits détaille le contenu de chacun.
Que faut-il modifier en cas de déménagement ?
Modifiez la destination du lien court utilisé par le bouton d'itinéraire, puis remplacez l'adresse d'intégration. Aucun support imprimé n'a besoin d'être changé.
Dernières vérifications
- Le bouton d'itinéraire ouvre l'application Maps sur un téléphone et une page cartographique sur un ordinateur.
- La carte intégrée affiche le bon repère et s'adapte à la largeur de la page sur un téléphone.
- Le code postal et les horaires d'ouverture figurent sur la page.
- La page ne contient qu'une seule carte.
- Vous avez effectué un test depuis Instagram, et pas seulement depuis votre navigateur.
