Reguli de brand

Următoarele instrucțiuni arată cum să includeți marca Google Pay pe site-urile dvs. web.

Butoane de plată Google Pay

Butonul de plată Google Pay trebuie să apeleze întotdeauna API-ul Google Pay. API-ul Google Pay apelează apoi foaia de plată unde utilizatorii își pot selecta metoda de plată.

Active

Metoda JavaScript createButton() inserează dinamic reguli CSS și un fișier SVG din CDN-ul Google pentru un element HTML <button> .

Când folosești metoda createButton() , obții:

  • Conformitate cu brandul: Integrați perfect un buton de plată Google Pay care respectă automat cele mai recente reguli de branding Google Pay, oferind în același timp opțiuni personalizabile pentru a se potrivi designului interfeței dvs. cu un efort minim.
  • Formă personalizabilă: Ajustați fin rotunjimea colțurilor butonului pentru a se potrivi perfect cu estetica designului existent.
  • Experiență localizată: Legenda butonului se traduce automat în limba browserului utilizatorului, îmbunătățind accesibilitatea.
  • Personalizat pentru utilizatori: Ajută utilizatorii să descopere metodele de plată disponibile în portofelul lor Google Pay pentru un proces de finalizare a comenzii mai rapid.

Dacă această metodă convenabilă sau limbile acceptate nu se potrivesc nevoilor dumneavoastră, contactați-ne .

Stil

Toate butoanele de plată Google Pay există în două stiluri: închis și deschis. Puteți vedea exemple pentru ambele stiluri în secțiunea Materiale . Numele mărcii Google Pay nu trebuie tradus. Nu creați butoane cu propriul text localizat.

Tipul butonului Întuneric Aprinde
carte Butoane de plată întunecate Google PayButoane de plată luminoase Google Pay
cumpăra Butoane de plată întunecate Google PayButoane de plată luminoase Google Pay
verifică Butoane de plată întunecate Google PayButoane de plată luminoase Google Pay
dona Butoane de plată întunecate Google PayButoane de plată luminoase Google Pay
comanda Butoane de plată întunecate Google PayButoane de plată luminoase Google Pay
plată Butoane de plată întunecate Google PayButoane de plată luminoase Google Pay
simplu Butoane de plată întunecate Google PayButoane de plată luminoase Google Pay
abonare Butoane de plată întunecate Google PayButoane de plată luminoase Google Pay

Folosește termenii specifici butonului care se potrivesc cel mai bine paginii tale de finalizare a comenzii.

Folosește butoane întunecate pe fundaluri deschise pentru a oferi contrast.

Folosește butoane luminoase pe fundaluri întunecate sau colorate.

Personalizare

Când utilizatorii au un card eligibil în contul lor Google Pay, butoanele de plată „Cumpără”, „Plătește” și „Simplu” vor afișa rețeaua cardului și ultimele patru cifre ale numărului cardului. Rețeaua cardului va fi afișată în aceeași poziție ca textul „Cumpără cu” sau „Plătește cu”.

Tipul butonului Întuneric Aprinde
cumpără, plătește și simplu Butoane de plată întunecate Google PayButoane de plată luminoase Google Pay

Folosește butonul de tip „cumpără”, „plătește” sau „simplu” pentru a activa personalizarea.

Folosește butoane întunecate pe fundaluri deschise pentru a oferi contrast.

Folosește butoane luminoase pe fundaluri întunecate sau colorate.

Buton personalizat

Folosește următorul instrument pentru a previzualiza aspectul fiecărui buton:

Spațiu liber

Mențineți întotdeauna un spațiu liber minim de 8 dp pe toate laturile butonului de plată. Asigurați-vă că spațiul liber nu este niciodată întrerupt de grafică sau text.

Exemplu de spațiu liber pentru butonul de plată Google Pay pentru Android

Exemple

Spațierea corectă a butoanelor
Dacă plasați un buton Google Pay lângă un alt buton, asigurați-vă că butonul Google Pay are aceeași dimensiune ca celălalt buton. Folosește întotdeauna un buton Google Pay care contrastează cu fundalul pe care apare.
Reglarea dimensiunii butonului
Când ajustați dimensiunea butonului Google Pay, păstrați întotdeauna proporțiile acestuia constante.

Ce să faci și ce să nu faci

Do Nu
  • Folosește doar butoanele Google Pay furnizate de Google.
  • Folosește butoanele Google Pay pentru a iniția fluxul de plată.
  • Folosește același stil de buton pe tot site-ul tău.
  • Asigurați-vă că dimensiunea butoanelor Google Pay rămâne egală sau mai mare decât a altor butoane.
  • Alegeți întotdeauna o culoare pentru butoane care contrastează cu fundalul.
  • Nu creați propriile butoane Google Pay și nu modificați în niciun fel fontul, culoarea, raza butonului sau spațiile interioare din interiorul acestuia.
  • Nu folosiți butoanele de plată Google Pay pentru a începe nicio acțiune, alta decât fluxul de plată.
  • Nu comutați între diferite stiluri de culoare
  • Nu comutați între versiunile cu și fără text.
  • Nu folosiți o culoare pentru buton similară cu fundalul. De exemplu, nu folosiți butonul alb pe un fundal alb.

Marca Google Pay

Folosește doar marca Google Pay furnizată în aceste instrucțiuni atunci când afișezi Google Pay ca opțiune în fluxurile de plată.

Active

Faceți clic pe butonul următor pentru a descărca marca Google Pay în format de fișier SVG:

Descărcați resursele

Marca

Folosește următorul marcaj Google Pay atunci când afișezi Google Pay ca opțiune de plată:

Marca Google Pay

Afișați „Google Pay” în text lângă marcă dacă faceți acest lucru pentru alte mărci. Nu modificați culoarea sau grosimea conturului mărcii și nu modificați marca în niciun fel. Folosiți doar marca furnizată de Google.

Spațiu liber

Mențineți întotdeauna cel puțin jumătate (0,5x) din înălțimea literei G majuscule pe toate laturile marcajului de acceptare Google Pay. Asigurați-vă că spațiul liber este la același nivel cu orice alte identități de marcă pe care le afișați.

Exemplu de spațiu liber marcat cu Google Pay

Dimensiune

Ajustați înălțimea pentru a se potrivi cu celelalte identități de marcă afișate în fluxul de plată. Nu faceți marca Google Pay mai mică decât alte identități de marcă.

Folosește marca Google Pay pentru a reprezenta Google Pay ca opțiune de plată pe parcursul procesului de cumpărare.

Ce să faci și ce să nu faci

Do Nu
  • Folosește doar marca Google Pay furnizată de Google.
  • Folosește marcajul Google Pay pentru a indica Google Pay ca opțiune de plată în fluxurile de plată.
  • Nu vă creați propria marcă și nu o modificați în niciun fel.
  • Nu traduceți cuvântul „A plăti”.
  • Nu afișa marca Google Pay la o dimensiune diferită sau mai mică decât cea a celorlalte opțiuni de plată.

Google Pay în text

Puteți folosi text pentru a indica Google Pay ca opțiune de plată și pentru a promova Google Pay în comunicarea dvs. de marketing.

Scrieți cu majusculă literele „G” și „P”
Folosește întotdeauna un „G” majuscul și un „P” majuscul, urmate de litere mici. Nu scrie cu majusculă numele complet „GOOGLE PAY” decât dacă este pentru a se potrivi cu stilul tipografic de pe site-ul tău web. Nu folosește niciodată „GOOGLE PAY” majuscul în comunicarea ta de marketing.
Nu abreviați Google Pay
Scrieți întotdeauna cuvintele „Google” și „Pay”.
Potrivește stilul de pe site-ul tău web
Setează „Google Pay” în același font și stil tipografic ca restul textului de pe site-ul tău web. Nu imita stilul tipografic al Google.
Nu traduceți Google Pay
Scrieți întotdeauna „Google Pay” în engleză. Nu traduceți în altă limbă.
Folosește simbolul mărcii comerciale prima dată când apare „Google Pay” în comunicarea de marketing
Când utilizați „Google Pay” în comunicarea dvs. de marketing, afișați simbolul mărcii comerciale, ™, prima sau cea mai vizibilă dată când apare. Nu utilizați simbolul mărcii comerciale atunci când listați Google Pay ca opțiune de plată pe site-ul dvs. web.
Dacă nu afișați identități de marcă pentru alte opțiuni de plată, reprezentați „Google Pay” cu text. Setează „Google Pay” în același font și stil tipografic ca restul textului de pe site-ul tău.

Cele mai bune practici Google Pay

Maximizați-vă conversiile cu fluxuri de finalizare a comenzii și foi de plată care permit clienților să își revizuiască rapid și ușor informațiile de plată și să își confirme achiziția.

Următoarele sunt cele mai bune practici:

Setați Google Pay ca opțiune principală de plată.
Ori de câte ori este posibil, afișați butonul Google Pay într-un loc vizibil. De asemenea, îl puteți seta ca opțiune implicită sau ca singura opțiune de plată.
Permiteți clienților dvs. să facă achiziții fără cont
Crearea unui cont încetinește procesul de finalizare a comenzii și poate duce la coșuri abandonate. Folosește Google Pay pentru a permite o finalizare mai rapidă a comenzii ca oaspete. Dacă dorești ca clienții tăi să creeze un cont, permite-le să facă acest lucru după ce finalizează achiziția.
Folosește Google Pay pentru a iniția plata în timpul finalizării coșului de cumpărături
Butonul Google Pay afișează foaia de plată. În foaia de plată, clienții pot selecta și confirma o singură metodă de plată și o singură adresă de livrare. Asigurați-vă că obțineți toate celelalte informații de care aveți nevoie înainte de a oferi clienților opțiunea de a selecta butonul Google Pay. Alte informații pot include următoarele:
  • Mărimea, culoarea sau cantitatea unui articol.
  • Opțiunea de a adăuga un mesaj cadou sau de a aplica un cod promoțional.
  • Posibilitatea de a alege diferite viteze de livrare și destinații pentru articole individuale.
Dacă un client nu furnizează informațiile necesare, oferă-i feedback în timp real pentru a-i spune de ce ai nevoie înainte de a putea afișa fișa de plată.
Adăugați butonul Google Pay pe paginile cu detalii despre produs, pe lângă finalizarea comenzii în coș.
Puteți accelera finalizarea comenzii pentru fiecare articol dacă permiteți clienților să facă achiziții individuale direct din paginile cu detalii despre produs. Dacă un client alege această opțiune, asigurați-vă că excludeți orice alte articole pe care le are în coșul de cumpărături, deoarece foaia de plată îi permite doar să confirme informațiile de plată și livrare.
Includeți Google Pay pe paginile de confirmare și pe chitanțe
Când afișați informațiile de plată pe paginile de confirmare și pe chitanțele trimise prin e-mail, asigurați-vă că indicați faptul că respectivul client a plătit cu Google Pay și că afișați Google Pay în același mod ca și alte metode de plată.
Nu afișați niciodată utilizatorului numere complete de cont, date de expirare sau alte detalii despre metoda de plată. Folosiți întotdeauna textul descriptiv returnat de API-ul Google Pay pentru a identifica metoda de plată.
Următoarele sunt exemple de texte descriptive acceptabile:
  • „Rețea •••• 1234 cu Google Pay”
  • „Rețea •••• 1234 (Google Pay)”
  • „Google Pay (Rețea •••• 1234)”
  • „Paypal abc...d@gmail.com cu Google Pay”
  • „Metodă de plată: Google Pay”
  • „Plătit cu Google Pay”
confirmarea plății
Când afișați informațiile de plată pe paginile de confirmare și pe chitanțele trimise prin e-mail, asigurați-vă că indicați faptul că respectivul client a plătit cu Google Pay.

Pune totul laolaltă

Următoarea imagine ilustrează o integrare finalizată. Integrarea include și etapa de selectare a articolului / pre-cumpărare , etapa de tranzacție , etapa de selectare Google Pay și etapa de post-cumpărare .

Experiență de flux de cumpărare web
Aceste ecrane reprezintă un flux de cumpărare Google Pay recomandat pentru o experiență de coș de cumpărături.

Obțineți aprobarea

După ce ați integrat API-ul Google Pay, pentru a obține acces la nivel de producție, trebuie să obțineți aprobarea pentru toate locurile în care afișați sau faceți referire la Google Pay.

Completați lista noastră de verificare pentru integrare pentru a trimite integrarea web spre examinare. Ar trebui să primiți aprobarea sau feedback în termen de o zi lucrătoare.