Zum Hauptinhalt springen
Deine Kunden können ihren Paketshop schon jetzt aus einer Liste wählen. Im Checkout können sie nach Postleitzahl oder Name des Paketshops suchen, im Warenkorb nach Postleitzahl. Mit zwei Schlüsseln aus deinem eigenen Google-Konto kannst du ihnen mehr bieten:
  • Ein Google-Maps-Schlüssel zeigt eine Karte mit einer Markierung für jeden Paketshop, in der Paketshop-Auswahl im Checkout und in der Paketshop-Auswahl im Warenkorb.
  • Ein Google-Schlüssel für die Adresssuche lässt Kunden im Checkout nach jeder beliebigen Adresse oder Gegend suchen und die Karte verschieben, um die Paketshops dort zu sehen.
Beide Schlüssel sind optional, und du kannst einen ohne den anderen hinzufügen. Ohne sie funktioniert trotzdem alles mit der Liste. Das Erstellen der Schlüssel dauert in Google Cloud etwa 15 Minuten, und diese Seite führt dich durch jeden Klick.
Das brauchst du

Was es kostet

Google gibt dir jeden Monat ein kostenloses Nutzungskontingent und berechnet die Nutzung, die darüber hinausgeht. Bei der Karte zählt jedes Mal, wenn ein Kunde sie öffnet. Bei der Adresssuche zählt jede Suche und jedes Mal, wenn ein Kunde die Karte verschiebt. Die aktuellen Preise von Google findest du unter Preise der Google Maps Platform. In Google Cloud kannst du eine Budgetwarnung einrichten, damit Google dir eine E-Mail schickt, bevor eine Rechnung zu hoch wird. Eine Budgetwarnung stoppt die Kosten nicht: Um zu begrenzen, was die Adresssuche kosten kann, lege zusätzlich ein tägliches Anfragelimit (ein Kontingent) für die Geocoding API fest.

Schritt 1: Ein Projekt in Google Cloud anlegen

1

Bei Google Cloud anmelden

Gehe zu console.cloud.google.com und melde dich mit deinem Google-Konto an.
2

Projekt erstellen

Erstelle ein neues Projekt und gib ihm einen Namen, den du wiedererkennst, zum Beispiel „Onlineshop-Karte“.
3

Abrechnung einrichten

Wenn Google danach fragt, füge ein Rechnungskonto mit deiner Zahlungskarte hinzu.

Schritt 2: Die APIs einschalten

Öffne in deinem Projekt Google Maps Platform und schalte diese beiden ein (aktivieren):
  • Maps JavaScript API: zeigt eine Karte auf einer Webseite an, zum Beispiel in deinem Checkout.
  • Geocoding API: lässt Kunden nach einer Adresse oder einem Gebiet suchen und die Karte verschieben, um die Paketshops dort zu sehen.

Schritt 3: Den Google-Maps-Schlüssel erstellen und auf deinen Onlineshop beschränken

Öffne in Google Maps Platform den Bereich Keys & Credentials, klicke auf Create credentials und wähle API key. Google zeigt deinen neuen Schlüssel an: einen langen Code, der mit „AIza“ beginnt. Kopiere ihn. Ein Schlüssel ohne Beschränkung funktioniert auf jeder Website. Jemand anderes könnte ihn also nutzen, und du würdest für dessen Karten bezahlen. Beschränke ihn auf die Adressen, unter denen deine Kunden den Checkout abschließen.
1

Einstellungen des Schlüssels öffnen

Klicke auf den Namen deines neuen Schlüssels.
2

Nur die Adressen deines Onlineshops erlauben

Wähle unter Application restrictions die Option Websites. Füge unter Website restrictions nacheinander jede Adresse hinzu, unter der deine Kunden den Checkout abschließen:
  • Deine eigene Domain, zum Beispiel https://nordlysliving.dk/*, und dieselbe mit *. davor, zum Beispiel https://*.nordlysliving.dk/*, damit auch Adressen wie www. und checkout. abgedeckt sind.
  • Deine Adresse bei Shopify, zum Beispiel https://nordlys-living.myshopify.com/*.
  • https://shop.app/*, wenn du für die Auswahl Include block in Shop Pay eingeschaltet hast.
3

Nur die Karte erlauben

Wähle unter API restrictions die Option Restrict key und setze nur bei Maps JavaScript API ein Häkchen.
4

Speichern

Klicke auf Save. Es kann ein paar Minuten dauern, bis die neuen Beschränkungen greifen.
Du weißt nicht, welche Adresse dein Checkout verwendet? Starte in deinem Onlineshop einen Checkout und sieh dir die Adressleiste deines Browsers an. Diese Adresse muss in der Liste stehen.

Schritt 4: Den Schlüssel für die Adresssuche erstellen

Die Adresssuche braucht einen zweiten Schlüssel. Anders als der Google-Maps-Schlüssel darf er nicht auf Websites beschränkt werden, sonst funktioniert die Adresssuche nicht.
1

Einen zweiten Schlüssel erstellen

Klicke in Keys & Credentials auf Create credentials und wähle erneut API key. Kopiere den neuen Schlüssel.
2

Nur die Adresssuche erlauben

Klicke auf den Namen des neuen Schlüssels. Wähle unter API restrictions die Option Restrict key und setze nur bei Geocoding API ein Häkchen.
3

Websites nicht beschränken

Wähle unter Application restrictions die Option None. Da der Schlüssel nur die Geocoding API erlaubt, kann ihn niemand nutzen, um Karten anzuzeigen.
4

Speichern

Klicke auf Save.
Verwende zwei verschiedene Schlüssel. Die Adresssuche funktioniert nicht mit einem Schlüssel, der auf Websites beschränkt ist, deshalb kann ein einzelner Schlüssel nicht beides.
Google benennt seine Menüs ab und zu um. Wenn ein Name hier nicht zu deinem Bildschirm passt, zeigt die Anleitung API-Schlüssel verwenden von Google die aktuellen Schritte.

Schritt 5: Die Schlüssel in Zippendo hinzufügen

1

Deinen Onlineshop öffnen

Klicke in der Seitenleiste auf Verkaufskanäle. Klicke im Tab Verbunden auf deinen Shopify-Onlineshop. Du landest im Tab Bestellungen & Checkout.
2

Google-Maps-Schlüssel einfügen

Füge in der Karte Paketshops im Checkout oder in der Karte Paketshops im Warenkorb den Google-Maps-Schlüssel in das Feld Google-Maps-Schlüssel (optional) ein und klicke auf Schlüssel speichern. Du siehst Google-Schlüssel gespeichert. Beide Karten verwenden dieselben Schlüssel, du fügst sie also nur einmal hinzu.
3

Schlüssel für die Adresssuche einfügen

Füge in der Karte Paketshops im Checkout den zweiten Schlüssel in das Feld Google-Schlüssel für die Adresssuche (optional) ein und klicke auf Schlüssel speichern. Akzeptiert Google den Schlüssel, siehst du Google-Schlüssel gespeichert, und im Feld steht Schlüssel gespeichert. Füge einen neuen ein, um ihn zu ersetzen. Der Warenkorb hat keine Adresssuche, deshalb zeigt seine Karte nur den Google-Maps-Schlüssel.
Google-Maps-Schlüssel (optional) mit einem gespeicherten Schlüssel und Google-Schlüssel für die Adresssuche (optional) mit Schlüssel gespeichert. Füge einen neuen ein, um ihn zu ersetzen, mit den Schaltflächen Schlüssel speichern und Schlüssel entfernenGoogle-Maps-Schlüssel (optional) mit einem gespeicherten Schlüssel und Google-Schlüssel für die Adresssuche (optional) mit Schlüssel gespeichert. Füge einen neuen ein, um ihn zu ersetzen, mit den Schaltflächen Schlüssel speichern und Schlüssel entfernen

Die beiden Schlüsselfelder auf der Karte Paketshops im Checkout

Zippendo zeigt den Schlüssel für die Adresssuche nach dem Speichern nicht mehr an. Um ihn zu entfernen, klicke auf Schlüssel entfernen. Um den Google-Maps-Schlüssel zu entfernen, leere sein Feld und klicke auf Schlüssel speichern.

Prüfen, ob es funktioniert

Starte in deinem Onlineshop einen Checkout, wähle deine Paketshop-Versandart und klicke auf Paketshop ändern. Mit dem Schlüssel für die Adresssuche steht im Suchfeld über der Liste Adresse, Postleitzahl oder Name des Paketshops. Mit dem Google-Maps-Schlüssel können deine Kunden zwischen Liste und Karte wechseln. Karte öffnet eine Karte mit einer Markierung für jeden Paketshop, jeweils mit dem Logo des Versanddienstleisters. Ist zusätzlich der Schlüssel für die Adresssuche hinterlegt, können Kunden über der Karte nach einer Adresse oder Postleitzahl suchen oder die Karte einfach verschieben, und die Paketshops in diesem Bereich erscheinen.
Fenster „Paketshop auswählen“ im Shopify-Checkout mit einem Suchfeld für Adresse oder Postleitzahl über einer Google-Karte von Kopenhagen und einer GLS-Markierung für jeden Paketshop

Die Karte, die deine Kunden nach einem Klick auf Karte sehen

Wenn sie auf eine Markierung klicken, sehen sie Name, Adresse und Öffnungszeiten des Paketshops. Mit Auswählen wählen sie ihn aus, und die Karte schließt sich.
Geöffnete Markierung auf der Karte mit Silvan Vesterbrogade, Vesterbrogade 10, København V, geöffnet Mo–So 09:00–19:00, und der Schaltfläche Auswählen

Klicke auf eine Markierung und dann auf Auswählen

Etwas funktioniert nicht?

  • Es gibt keine Karte. Kopiere den Google-Maps-Schlüssel erneut aus Google Cloud und füge den ganzen Schlüssel ein. Vergleiche die Adresse in deinem Browser während des Checkouts mit den Website restrictions des Schlüssels und prüfe, ob die Maps JavaScript API eingeschaltet und die Abrechnung eingerichtet ist. Zeigt der Checkout die Versandarten in einem Fenster über der Seite, gibt es keine Schaltfläche Karte: Shopify erlaubt dort keine Karte.
  • Zippendo meldet: Google hat diesen Schlüssel nicht akzeptiert. Der Schlüssel für die Adresssuche ist auf Websites beschränkt, oder die Geocoding API ist für ihn nicht eingeschaltet. Behebe beides in Google Cloud oder erstelle einen neuen Schlüssel wie in Schritt 4.
  • Kunden können nicht nach einer Adresse suchen, oder beim Verschieben der Karte erscheinen keine neuen Paketshops. Prüfe, ob du einen Schlüssel für die Adresssuche gespeichert hast und ob in deinem Google-Cloud-Projekt die Geocoding API noch eingeschaltet und die Abrechnung eingerichtet ist.
  • Du hast gerade einen Schlüssel geändert. Warte ein paar Minuten und versuche es erneut.

Wer was sieht

Die Karte kommt direkt von Google, mit deinem Google-Maps-Schlüssel. Wenn ein Kunde nach einer Adresse sucht oder die Karte verschiebt, gibt Zippendo das, was er eingetippt hat, oder die Stelle auf der Karte mit deinem Schlüssel für die Adresssuche an Google weiter. Beide Schlüssel laufen im Rahmen deiner eigenen Vereinbarung mit Google, und Google stellt die Nutzung deinem Konto in Rechnung. Siehe auch: Paketshop-Auswahl zum Shopify-Checkout hinzufügen · Paketshop-Auswahl im Checkout