Passer au contenu principal
Vos clients peuvent déjà choisir leur point relais dans une liste. En caisse, ils peuvent le rechercher par code postal ou par nom de point relais, et dans le panier, par code postal. Avec deux clés issues de votre propre compte Google, vous pouvez leur offrir davantage :
  • Une clé Google Maps affiche une carte avec une épingle pour chaque point relais, dans le sélecteur de points relais en caisse et dans le sélecteur de points relais du panier.
  • Une clé Google de recherche d’adresse permet à vos clients de rechercher n’importe quelle adresse ou n’importe quel secteur en caisse, et de déplacer la carte pour voir les points relais qui s’y trouvent.
Les deux clés sont facultatives, et vous pouvez ajouter l’une sans l’autre. Sans elles, tout fonctionne quand même avec la liste. Créer les clés prend environ 15 minutes dans Google Cloud, et cette page vous guide clic par clic.
Ce dont vous avez besoin

Ce que cela coûte

Google vous offre chaque mois un certain volume d’utilisation gratuit, et facture l’utilisation au-delà. La carte est comptée chaque fois qu’un client l’ouvre. La recherche d’adresse est comptée à chaque recherche et chaque fois qu’un client déplace la carte. Les tarifs actuels de Google sont indiqués sur la page tarifs de Google Maps Platform. Dans Google Cloud, vous pouvez définir une alerte de budget, pour que Google vous prévienne par e-mail avant que la facture n’augmente. Une alerte de budget n’arrête pas les frais : pour plafonner ce que la recherche d’adresse peut coûter, définissez aussi une limite quotidienne de requêtes (un quota) pour la Geocoding API.

Étape 1 : Créer un projet dans Google Cloud

1

Se connecter à Google Cloud

Allez sur console.cloud.google.com et connectez-vous avec votre compte Google.
2

Créer un projet

Créez un nouveau projet et donnez-lui un nom que vous reconnaîtrez, par exemple « Carte de la boutique ».
3

Configurer la facturation

Lorsque Google vous le demande, ajoutez un compte de facturation avec votre carte bancaire.

Étape 2 : Activer les API

Dans votre projet, ouvrez Google Maps Platform et activez (Enable) ces deux API :
  • Maps JavaScript API : affiche une carte sur une page web, comme votre caisse.
  • Geocoding API : permet à vos clients de rechercher une adresse ou une zone, et de déplacer la carte pour voir les points relais qui s’y trouvent.

Étape 3 : Créer la clé Google Maps et la limiter à votre boutique en ligne

Dans Google Maps Platform, ouvrez Keys & Credentials, cliquez sur Create credentials et choisissez API key. Google affiche votre nouvelle clé : un long code qui commence par « AIza ». Copiez-la. Une clé non limitée fonctionne sur n’importe quel site web : quelqu’un d’autre pourrait donc l’utiliser, et ce serait à vous de payer ses affichages de carte. Limitez-la aux adresses sur lesquelles vos clients passent commande.
1

Ouvrir les paramètres de la clé

Cliquez sur le nom de votre nouvelle clé.
2

N'autoriser que les adresses de votre boutique en ligne

Sous Application restrictions, choisissez Websites. Sous Website restrictions, ajoutez une à une chaque adresse sur laquelle vos clients passent commande :
  • Votre propre domaine, par exemple https://nordlysliving.dk/*, ainsi que le même précédé de *., par exemple https://*.nordlysliving.dk/*, afin d’inclure des adresses comme www. et checkout.
  • Votre adresse Shopify, par exemple https://nordlys-living.myshopify.com/*.
  • https://shop.app/*, si vous avez activé Include block in Shop Pay pour le sélecteur.
3

N'autoriser que la carte

Sous API restrictions, choisissez Restrict key et cochez uniquement Maps JavaScript API.
4

Enregistrer

Cliquez sur Save. Les nouvelles limites peuvent mettre quelques minutes à s’appliquer.
Vous ne savez pas quelle adresse utilise votre caisse ? Démarrez une commande dans votre boutique en ligne et regardez la barre d’adresse de votre navigateur. Cette adresse doit figurer dans la liste.

Étape 4 : Créer la clé de recherche d’adresse

La recherche d’adresse nécessite une seconde clé. Contrairement à la clé Google Maps, elle ne doit pas être limitée à des sites web, sinon la recherche d’adresse ne fonctionnera pas.
1

Créer une seconde clé

Dans Keys & Credentials, cliquez sur Create credentials et choisissez de nouveau API key. Copiez la nouvelle clé.
2

N'autoriser que la recherche d'adresse

Cliquez sur le nom de la nouvelle clé. Sous API restrictions, choisissez Restrict key et cochez uniquement Geocoding API.
3

Ne pas limiter les sites web

Sous Application restrictions, choisissez None. Comme la clé n’autorise que la Geocoding API, personne ne peut l’utiliser pour afficher des cartes.
4

Enregistrer

Cliquez sur Save.
Utilisez deux clés différentes. La recherche d’adresse ne fonctionne pas avec une clé limitée à des sites web : une seule clé ne peut donc pas servir aux deux.
Google renomme ses menus de temps en temps. Si un nom indiqué ici ne correspond pas à votre écran, le guide de Google Utiliser des clés API présente les étapes actuelles.

Étape 5 : Ajouter les clés dans Zippendo

1

Ouvrir votre boutique en ligne

Cliquez sur Canaux de vente dans la barre latérale. Dans l’onglet Connectés, cliquez sur votre boutique en ligne Shopify. Vous arrivez sur l’onglet Commandes et caisse.
2

Coller la clé Google Maps

Dans la carte Points relais en caisse, ou dans la carte Points relais dans le panier, collez la clé Google Maps dans Clé Google Maps (facultatif) et cliquez sur Enregistrer la clé. Le message Clé Google enregistrée s’affiche. Les deux cartes utilisent les mêmes clés : vous ne les ajoutez donc qu’une seule fois.
3

Coller la clé de recherche d'adresse

Dans la carte Points relais en caisse, collez la seconde clé dans Clé Google de recherche d’adresse (facultatif) et cliquez sur Enregistrer la clé. Si Google accepte la clé, le message Clé Google enregistrée s’affiche, et le champ indique Clé enregistrée. Collez une nouvelle clé pour la remplacer. Le panier n’a pas de recherche d’adresse : sa carte n’affiche donc que la clé Google Maps.
Clé Google Maps (facultatif) avec une clé enregistrée, et Clé Google de recherche d'adresse (facultatif) indiquant Clé enregistrée. Collez une nouvelle clé pour la remplacer, avec les boutons Enregistrer la clé et Supprimer la cléClé Google Maps (facultatif) avec une clé enregistrée, et Clé Google de recherche d'adresse (facultatif) indiquant Clé enregistrée. Collez une nouvelle clé pour la remplacer, avec les boutons Enregistrer la clé et Supprimer la clé

Les deux champs de clé de la carte Points relais en caisse

Zippendo n’affiche plus la clé de recherche d’adresse une fois que vous l’avez enregistrée. Pour la retirer, cliquez sur Supprimer la clé. Pour retirer la clé Google Maps, videz son champ et cliquez sur Enregistrer la clé.

Vérifier que tout fonctionne

Démarrez une commande dans votre boutique en ligne, choisissez votre mode de livraison en point relais et cliquez sur Changer de point relais. Avec la clé de recherche d’adresse, le champ de recherche au-dessus de la liste indique Adresse, code postal ou nom du point relais. Avec la clé Google Maps, vos clients peuvent basculer entre Liste et Carte. Carte affiche une carte avec une épingle pour chaque point relais, au logo du transporteur. Avec en plus la clé de recherche d’adresse, les clients peuvent rechercher une adresse ou un code postal au-dessus de la carte, ou simplement déplacer la carte, et les points relais de cette zone s’affichent.
Fenêtre Choisir un point relais dans la caisse Shopify, avec un champ de recherche par adresse ou code postal au-dessus d'une carte Google de Copenhague, et une épingle GLS pour chaque point relais

La carte que vos clients voient après avoir cliqué sur Carte

Lorsqu’ils cliquent sur une épingle, ils voient le nom, l’adresse et les horaires d’ouverture du point relais. Un clic sur Choisir le sélectionne et ferme la carte.
Une épingle ouverte sur la carte, avec Silvan Vesterbrogade, Vesterbrogade 10, København V, ouvert lun.–dim. 09:00–19:00, et un bouton Choisir

Cliquez sur une épingle, puis sur Choisir

Quelque chose ne fonctionne pas ?

  • Il n’y a pas de carte. Copiez de nouveau la clé Google Maps depuis Google Cloud et collez la clé entière. Comparez l’adresse affichée dans votre navigateur pendant la commande avec les Website restrictions de la clé, et vérifiez que la Maps JavaScript API est activée et que la facturation est configurée. Lorsque la caisse affiche les modes de livraison dans une fenêtre par-dessus la page, il n’y a pas de bouton Carte : Shopify n’y autorise aucune carte.
  • Zippendo indique « Google n’a pas accepté cette clé ». La clé de recherche d’adresse est limitée à des sites web, ou la Geocoding API n’est pas activée pour elle. Corrigez ces deux points dans Google Cloud, ou créez une nouvelle clé comme à l’étape 4.
  • Les clients ne peuvent pas rechercher d’adresse, ou le déplacement de la carte n’affiche aucun nouveau point relais. Vérifiez que vous avez enregistré une clé de recherche d’adresse, et que la Geocoding API est toujours activée et la facturation configurée dans votre projet Google Cloud.
  • Vous venez de modifier une clé. Attendez quelques minutes et réessayez.

Qui voit quoi

La carte provient directement de Google, avec votre clé Google Maps. Lorsqu’un client recherche une adresse ou déplace la carte, Zippendo transmet à Google ce qu’il a saisi, ou l’endroit sur la carte, avec votre clé de recherche d’adresse. Les deux clés fonctionnent selon votre propre contrat avec Google, et Google facture votre compte. Voir aussi : Ajouter le sélecteur de points relais à la caisse Shopify · Sélecteur de points relais en caisse