In den folgenden Richtlinien wird beschrieben, wie Sie die Google Pay-Marke auf Ihren Websites einbinden.
Google Pay-Zahlungsschaltflächen
Über die Google Pay-Zahlungsschaltfläche muss immer die Google Pay API aufgerufen werden. Die Google Pay API ruft dann das Zahlungsformular auf, in dem Nutzer ihre Zahlungsmethode auswählen können.
Assets
Mit der JavaScript-Methode createButton() werden dynamisch CSS-Regeln und eine SVG-Datei aus dem Google-CDN für ein HTML-Element <button> eingefügt.
Wenn Sie die Methode createButton()
verwenden, erhalten Sie Folgendes:
- Markenkonformität:Sie können ganz einfach eine Google Pay-Zahlungsschaltfläche einbinden, die automatisch den aktuellen Google Pay-Branding-Richtlinien entspricht. Außerdem haben Sie die Möglichkeit, das Design der Schaltfläche mit minimalem Aufwand an Ihre Benutzeroberfläche anzupassen.
- Anpassbare Form:Sie können die Eckenrundung der Schaltfläche anpassen, damit sie sich nahtlos in Ihr bestehendes Design einfügt.
- Lokalisierte Darstellung:Die Beschriftung der Schaltfläche wird automatisch in die Browsersprache des Nutzers übersetzt, was die Barrierefreiheit verbessert.
- Personalisierung für Nutzer: Nutzer können verfügbare Zahlungsmethoden in ihrem Google Pay-Wallet entdecken, um den Bezahlvorgang zu beschleunigen.
Wenn diese Methode oder die unterstützten Sprachen nicht Ihren Anforderungen entsprechen, wenden Sie sich an uns.
Stil
Alle Google Pay-Zahlungsschaltflächen sind in zwei Designs verfügbar: dunkel und hell. Beispiele für beide Stile finden Sie im Abschnitt „Assets“. Der Markenname „Google Pay“ darf nicht übersetzt werden. Erstellen Sie keine Schaltflächen mit selbst übersetztem Text.
| Schaltflächentyp | Dunkel | Hell |
| book |  |
 |
| buy |  |
 |
| Schritt im |  |
 |
| spenden |  |
 |
| Bestellung |  |
 |
| pay |  |
 |
| plain |  |
 |
| abonnieren |  |
 |
Verwenden Sie die Formulierung für den Schaltflächentyp, die am besten zu Ihrer Zahlungsseite passt. |
Verwende dunkle Schaltflächen auf hellem Hintergrund, um einen Kontrast zu erzeugen. |
Verwende helle Schaltflächen auf dunklem oder farbigem Hintergrund. |
Personalisierung
Wenn Nutzer eine berechtigte Karte in ihrem Google Pay-Konto haben, werden auf den Zahlungs-Schaltflächen „Kaufen“, „Bezahlen“ und „Einfach“ das Kartennetzwerk und die letzten vier Ziffern der Kartennummer angezeigt. Das Kartennetzwerk wird an derselben Stelle wie der Text „Kaufen mit“ oder „Bezahlen mit“ angezeigt.
| Schaltflächentyp | Dunkel | Hell |
| Kaufen, bezahlen und einfach |  |
 |
Verwenden Sie den Schaltflächentyp „Kaufen“, „Bezahlen“ oder „Einfach“, um die Personalisierung zu aktivieren. |
Verwende dunkle Schaltflächen auf hellem Hintergrund, um einen Kontrast zu erzeugen. |
Verwende helle Schaltflächen auf dunklem oder farbigem Hintergrund. |
Benutzerdefinierter Button
Mit dem folgenden Tool können Sie sich eine Vorschau der einzelnen Schaltflächen ansehen:
Mindestabstand
Halte an allen Seiten der Zahlungsaufschaltfläche einen Mindestabstand von 8 dp ein. Achte darauf, dass sich innerhalb des Mindestabstands keine Grafiken und kein Text befinden.
Beispiele
| Wenn Sie eine Google Pay-Schaltfläche neben einer anderen Schaltfläche platzieren, muss die Google Pay-Schaltfläche dieselbe Größe wie die andere Schaltfläche haben. | Verwenden Sie immer einen Google Pay-Button, der sich vom Hintergrund abhebt. |
| Achten Sie beim Anpassen der Größe der Google Pay-Schaltfläche immer darauf, dass die Proportionen beibehalten werden. |
Empfohlene und zu vermeidende Vorgehensweisen
| Erlaubt | Nicht erlaubt |
|---|---|
|
|
Google Pay-Marke
Verwenden Sie in Ihren Zahlungsabläufen nur das Google Pay-Zeichen, das in diesen Richtlinien angegeben ist.
Assets
Klicken Sie auf die folgende Schaltfläche, um das Google Pay-Markenzeichen im SVG-Dateiformat herunterzuladen:
Assets herunterladenZeichen
Verwenden Sie das folgende Google Pay-Zeichen, wenn Sie Google Pay als Zahlungsoption angeben:
Wenn Sie „Google Pay“ in Textform neben dem Zeichen anzeigen, tun Sie dies auch für andere Marken. Ändern Sie nicht die Farbe oder Stärke des Umrisses des Logos und verändern Sie das Logo nicht auf andere Weise. Verwenden Sie nur die von Google bereitgestellte Marke.
Mindestabstand
Halten Sie an allen Seiten des Google Pay-Akzeptanzzeichens einen Mindestabstand von mindestens der Hälfte (0,5-mal) der Höhe des großen G ein. Achten Sie darauf, dass der Abstand zwischen allen Markenidentitäten gleich ist.
Größe
Passen Sie die Höhe so an, dass sie den anderen Markenidentitäten in Ihrem Zahlungsvorgang entspricht. Das Google Pay-Zeichen darf nicht kleiner als andere Markenidentitäten sein.
Empfohlene und zu vermeidende Vorgehensweisen
| Erlaubt | Nicht erlaubt |
|---|---|
|
|
Google Pay im Text
Sie dürfen Text verwenden, um Google Pay als Zahlungsoption anzugeben und Google Pay in Ihrer Marketingkommunikation zu bewerben.
- Die Buchstaben „G“ und „P“ in Großbuchstaben schreiben
- Verwende immer ein großes „G“ und ein großes „P“ gefolgt von Kleinbuchstaben. Schreibe den Namen „Google Pay“ nie vollständig in Großbuchstaben, es sei denn, dies entspricht dem typografischen Stil deiner Website. Verwende in deiner Marketingkommunikation niemals „GOOGLE PAY“ in Großbuchstaben.
- Google Pay nicht abkürzen
- Schreibe die Wörter „Google“ und „Pay“ immer aus.
- Stil an Ihre Website anpassen
- Verwende für „Google Pay“ dieselbe Schriftart und denselben typografischen Stil wie für den übrigen Text auf deiner Website. Ahmen Sie nicht den typografischen Stil von Google nach.
- Google Pay nicht übersetzen
- Schreibe „Google Pay“ immer auf Englisch. Übersetze es nicht in eine andere Sprache.
- Verwenden Sie das Markensymbol bei der ersten Erwähnung von „Google Pay“ in Marketingmitteilungen.
- Wenn Sie „Google Pay“ in Ihrer Marketingkommunikation verwenden, müssen Sie bei der ersten oder auffälligsten Verwendung das Markensymbol ™ einfügen. Verwenden Sie das Markensymbol nicht, wenn Sie Google Pay als Zahlungsoption auf Ihrer Website angeben.
| Wenn Sie keine Markenidentitäten für andere Zahlungsoptionen anzeigen, stellen Sie „Google Pay“ mit Text dar. | Verwenden Sie für „Google Pay“ dieselbe Schriftart und denselben typografischen Stil wie für den übrigen Text auf Ihrer Website. |
Best Practices für Google Pay
Mit optimierten Bezahlvorgängen und Zahlungsblättern können Kunden ihre Zahlungsinformationen schnell und einfach prüfen und ihren Kauf bestätigen. So lassen sich mehr Conversions erzielen.
Hier sind einige Best Practices:
- Google Pay als primäre Zahlungsoption festlegen
- Der Google Pay-Button sollte möglichst gut sichtbar platziert werden. Sie können sie auch zur Standardoption oder zur einzigen Zahlungsoption machen.
- Kunden die Möglichkeit bieten, auch ohne Konto Käufe zu tätigen
- Die Kontoerstellung verlangsamt den Bezahlvorgang und kann dazu führen, dass Kunden den Einkaufswagen verlassen. Mit Google Pay können Sie das Bezahlen als Gast beschleunigen. Wenn Sie möchten, dass Ihre Kunden ein Konto erstellen, ermöglichen Sie ihnen dies nach Abschluss des Kaufs.
- Google Pay verwenden, um den Bezahlvorgang auszulösen
- Über den Google Pay-Button wird das Zahlungsblatt aufgerufen. Auf dem Zahlungsformular können Kunden nur eine Zahlungsmethode und eine Versandadresse auswählen und bestätigen. Holen Sie alle anderen erforderlichen Informationen ein, bevor Sie Kunden die Möglichkeit geben, die Google Pay-Schaltfläche auszuwählen. Weitere Informationen können Folgendes umfassen:
- Größe, Farbe oder Menge eines Artikels.
- Die Option, eine Geschenknachricht hinzuzufügen oder einen Gutscheincode einzulösen.
- Sie können für einzelne Artikel unterschiedliche Versandgeschwindigkeiten und ‑ziele auswählen.
- Wenn ein Kunde die erforderlichen Informationen nicht angibt, bieten Sie Echtzeit-Feedback an, um ihm mitzuteilen, was Sie benötigen, bevor er das Zahlungsblatt aufrufen kann.
- Google Pay-Schaltfläche zusätzlich zur Zahlungsseite im Einkaufswagen auf den Produktdetailseiten einfügen
- Sie können den Direktkauf von einzelnen Artikeln beschleunigen, indem Sie Kunden ermöglichen, direkt auf Ihren Produktdetailseiten einzelne Artikel zu kaufen. Wenn ein Kunde diese Option auswählt, müssen Sie alle anderen Artikel im Einkaufswagen ausschließen, da er im Zahlungsformular nur seine Zahlungs- und Versandinformationen bestätigen kann.
- Google Pay auf Bestätigungsseiten und Belegen erwähnen
- Wenn Sie Zahlungsinformationen auf Bestätigungsseiten und in E‑Mail-Belegen anzeigen, müssen Sie angeben, dass der Kunde mit Google Pay bezahlt hat, und Google Pay auf dieselbe Weise wie andere Zahlungsmethoden darstellen.
- Dem Nutzer dürfen niemals vollständige Kontonummern, Ablaufdaten oder andere Details zur Zahlungsmethode angezeigt werden. Verwenden Sie immer den beschreibenden Text der Google Pay API, um die Zahlungsmethode zu identifizieren.
- Hier einige Beispiele für zulässige beschreibende Texte:
- „Netzwerk •••• 1234 mit Google Pay“
- „Netzwerk •••• 1234 (Google Pay)“
- „Google Pay (Network •••• 1234)“
- „Paypal abc...d@gmail.com with Google Pay“
- „Zahlungsmethode: Google Pay“
- „Mit Google Pay bezahlt“
Alle Antworten zu einem Anzeigentext zusammenfügen
Das folgende Bild zeigt eine abgeschlossene Integration. Die Integration umfasst auch die Schritte Artikelauswahl/Vor dem Kauf, Transaktion, Google Pay-Auswahl und Nach dem Kauf.
Genehmigung einholen
Nachdem Sie die Google Pay API eingebunden haben, müssen Sie eine Genehmigung für alle Stellen einholen, an denen Sie Google Pay präsentieren oder darauf verweisen, um Produktionszugriff zu erhalten.
Füllen Sie unsere Integrations-Checkliste aus, um Ihre Webintegration zur Überprüfung einzureichen. Sie sollten innerhalb eines Arbeitstages eine Genehmigung oder Feedback erhalten.