توضّح الإرشادات التالية كيفية تضمين علامة Google Pay التجارية في مواقعك الإلكترونية.
أزرار الدفع في Google Pay
يجب أن يستدعي زر الدفع في Google Pay دائمًا واجهة Google Pay API. بعد ذلك، يستدعي Google Pay API ورقة الدفع التي يمكن للمستخدمين اختيار طريقة الدفع منها.
مواد العرض
تُدرج طريقة JavaScript createButton()
ديناميكيًا قواعد CSS وملف SVG من شبكة توصيل المحتوى (CDN) من Google لعنصر
HTML <button>.
عند استخدام طريقة createButton()
، ستحصل على:
- الامتثال للعلامة التجارية: يمكنك دمج زر دفع Google Pay بسلاسة، مع الالتزام تلقائيًا بأحدث إرشادات العلامة التجارية الخاصة بخدمة Google Pay، بالإضافة إلى توفير خيارات قابلة للتخصيص لتتطابق مع تصميم واجهة المستخدم بأقل جهد ممكن.
- شكل قابل للتخصيص: يمكنك ضبط استدارة زوايا الزر بما يتناسب مع التصميم الحالي.
- تجربة ملائمة للغة المستخدم: تتم ترجمة عنوان الزر تلقائيًا إلى لغة المتصفّح التي يستخدمها المستخدم، ما يحسّن إمكانية الوصول.
- تخصيص تجربة المستخدمين: يمكنك مساعدة المستخدمين في العثور على طرق الدفع المتاحة في محفظة Google Pay الخاصة بهم لتسريع عملية الدفع.
إذا لم تناسبك طريقة الدفع المريحة هذه أو اللغات المتاحة، يُرجى التواصل معنا.
النمط
تتوفّر جميع أزرار الدفع في Google Pay بنمطَين: داكن وفاتح. يمكنك الاطّلاع على أمثلة على كلا النمطين في قسم "مواد العرض". يجب عدم ترجمة اسم العلامة التجارية Google Pay. لا تنشئ أزرارًا تتضمّن نصًا مترجمًا.
| نوع الزر | داكن | خفيفة |
| book |  |
 |
| buy |  |
 |
| الدفع |  |
 |
| تبرّع |  |
 |
| طلب |  |
 |
| pay |  |
 |
| plain |  |
 |
| اشتراك |  |
 |
استخدِم عبارات نوع الزر الأنسب لصفحة الدفع. |
استخدِم أزرارًا داكنة على خلفيات فاتحة لتوفير التباين. |
استخدِم أزرارًا فاتحة على خلفيات داكنة أو ملونة. |
التخصيص
عندما يملك المستخدمون بطاقة مؤهّلة في حساباتهم على Google Pay، ستعرض أزرار الدفع "شراء" و"دفع" و "عادي" شبكة البطاقة وآخر أربعة أرقام من رقم البطاقة. ستظهر شبكة البطاقة في الموضع نفسه الذي يظهر فيه النص "الشراء باستخدام" أو "الدفع باستخدام".
| نوع الزر | داكن | خفيفة |
| الشراء والدفع واللعب |  |
 |
استخدِم نوع الزر "شراء" أو "دفع" أو "عادي" لتفعيل التخصيص. |
استخدِم أزرارًا داكنة على خلفيات فاتحة لتوفير التباين. |
استخدِم أزرارًا فاتحة على خلفيات داكنة أو ملونة. |
زر مخصّص
استخدِم الأداة التالية لمعاينة مظهر كل زر:
المساحة الخالية
احرص دائمًا على الحفاظ على الحد الأدنى للمساحة الخالية البالغ 8 وحدات بكسل مستقلة الكثافة على جميع جوانب زر الدفع. تأكَّد من عدم قطع المساحة الفارغة بأي رسومات أو نصوص.
أمثلة
| إذا وضعت زر Google Pay بجانب زر آخر، تأكَّد من أنّ حجم زر Google Pay يساوي حجم الزر الآخر. | استخدِم دائمًا زر Google Pay يتباين مع الخلفية التي يظهر عليها. |
| عند تعديل حجم زر Google Pay، احرص دائمًا على الحفاظ على تناسق نسبه. |
الإجراءات المسموح بها وغير المسموح بها
| الإجراءات المقترَحة | ما ننصحك بتجنّبه |
|---|---|
|
|
علامة Google Pay
استخدِم علامة Google Pay فقط الواردة في هذه الإرشادات عند عرض Google Pay كخيار في مسارات الدفع.
مواد العرض
انقر على الزرّ التالي لتنزيل علامة Google Pay بتنسيق ملف SVG:
تنزيل مواد العرضتمييز
استخدِم علامة Google Pay التالية عند عرض Google Pay كخيار للدفع:
اعرض "Google Pay" في النص بجانب العلامة إذا كنت تفعل ذلك مع علامات تجارية أخرى. لا تغيِّر لون أو كثافة مخطط العلامة، ولا تعدِّل العلامة بأي شكل من الأشكال. استخدِم العلامة التي توفّرها Google فقط.
المساحة الخالية
يجب دائمًا الحفاظ على نصف ارتفاع حرف G الكبير (0.5x) على الأقل على جميع جوانب علامة قبول Google Pay. احرص على أن تكون المساحة الخالية متساوية مع أي هويات أخرى للعلامة التجارية تعرضها.
الحجم
اضبط الارتفاع ليتطابق مع هويات العلامات التجارية الأخرى المعروضة في مسار الدفع. لا تصغِّر علامة Google Pay عن العلامات التجارية الأخرى.
الإجراءات المسموح بها وغير المسموح بها
| الإجراءات المقترَحة | ما ننصحك بتجنّبه |
|---|---|
|
|
Google Pay في النص
يمكنك استخدام نص للإشارة إلى أنّ Google Pay هو أحد خيارات الدفع، وللترويج لخدمة Google Pay في رسائل التسويق التي ترسلها.
- كتابة الحرفين "G" و "P" بأحرف كبيرة
- استخدِم دائمًا الحرف "G" كبيرًا والحرف "P" كبيرًا متبوعًا بأحرف صغيرة. لا تكتب الاسم الكامل "Google Pay" بأحرف كبيرة إلا إذا كان ذلك بهدف مطابقة الأسلوب الطباعي على موقعك الإلكتروني. لا تستخدِم أبدًا الأحرف الكبيرة في كلمة "GOOGLE PAY" في رسالتك التسويقية.
- عدم اختصار Google Pay
- اكتب دائمًا الكلمتَين "Google" و "Pay".
- مطابقة النمط على موقعك الإلكتروني
- استخدِم الخط نفسه ونمط الطباعة نفسه المستخدَمَين في بقية النص على موقعك الإلكتروني عند عرض "Google Pay". لا تحاول تقليد أسلوب Google في الكتابة.
- عدم ترجمة Google Pay
- اكتب دائمًا "Google Pay" باللغة الإنجليزية. لا تترجمه إلى لغة أخرى.
- استخدِم رمز العلامة التجارية المسجّلة في المرة الأولى التي يظهر فيها الاسم "Google Pay" في مراسلات التسويق
- عند استخدام "Google Pay" في مراسلاتك التسويقية، يجب عرض رمز العلامة التجارية المسجّلة، ™، في المرة الأولى أو الأبرز التي يظهر فيها الاسم. لا تستخدِم رمز العلامة التجارية المسجّلة عند إدراج Google Pay كخيار للدفع على موقعك الإلكتروني.
| إذا كنت لا تعرض هويات العلامات التجارية لخيارات الدفع الأخرى، يمكنك تمثيل "Google Pay" باستخدام نص. | استخدِم الخط نفسه ونمط الكتابة نفسه الذي تستخدمه في بقية النص على موقعك الإلكتروني عند كتابة "Google Pay". |
أفضل الممارسات في Google Pay
يمكنك زيادة إحالاتك الناجحة إلى أقصى حدّ من خلال عمليات الدفع وأوراق الدفع التي تتيح للعملاء مراجعة معلومات الدفع وتأكيد عملية الشراء بسرعة وسهولة.
في ما يلي أفضل الممارسات:
- اجعل Google Pay خيار الدفع الأساسي.
- اعرض زر Google Pay بشكل بارز حيثما أمكن ذلك. يمكنك أيضًا ضبطها كخيار تلقائي أو خيار الدفع الوحيد.
- السماح للعملاء بإجراء عمليات شراء بدون حساب
- يؤدي إنشاء حساب إلى إبطاء عملية الدفع وقد يؤدي إلى التخلي عن عربات التسوق. استخدِم Google Pay لتفعيل ميزة "الدفع كضيف" بشكل أسرع. إذا كنت تريد أن ينشئ عملاؤك حسابًا، اسمح لهم بذلك بعد إتمام عملية الشراء.
- استخدام Google Pay لبدء عملية الدفع أثناء إتمام عملية الشراء في سلة التسوّق
- يؤدي النقر على زر Google Pay إلى فتح ورقة الدفع. في صفحة الدفع، يمكن للعملاء اختيار طريقة دفع واحدة وعنوان شحن واحد وتأكيدهما فقط. احرص على الحصول على جميع المعلومات الأخرى التي تحتاج إليها قبل أن تتيح للعملاء خيار النقر على زر Google Pay. يمكن أن تتضمّن المعلومات الأخرى ما يلي:
- حجم السلعة أو لونها أو كميتها
- خيار لإضافة رسالة هدية أو تطبيق رمز ترويجي
- إمكانية اختيار سرعات شحن ووجهات مختلفة لكل سلعة على حدة
- إذا لم يقدّم العميل المعلومات اللازمة، قدِّم له ملاحظات في الوقت الفعلي لإعلامه بالمعلومات التي تحتاجها قبل أن يتمكّن من عرض ورقة الدفع.
- إضافة زر Google Pay إلى صفحات تفاصيل المنتجات بالإضافة إلى الدفع في سلة التسوق
- يمكنك تسريع عملية الدفع لسلعة واحدة إذا سمحت للعملاء بإجراء عمليات شراء فردية مباشرةً من صفحات تفاصيل المنتج. إذا اختار العميل هذا الخيار، احرص على استبعاد أي سلع أخرى في سلّة التسوّق لأنّ ورقة الدفع تتيح له فقط تأكيد معلومات الدفع والشحن.
- تضمين Google Pay في صفحات التأكيد والإيصالات
- عند عرض معلومات الدفع على صفحات التأكيد وإيصالات البريد الإلكتروني، احرص على الإشارة إلى أنّ العميل قد دفع باستخدام Google Pay، وأنّك تعرض Google Pay بالطريقة نفسها التي تعرض بها طرق الدفع الأخرى.
- يجب عدم عرض أرقام الحسابات الكاملة أو تواريخ انتهاء الصلاحية أو تفاصيل طرق الدفع الأخرى للمستخدم. استخدِم دائمًا النص الوصفي الذي تعرضه Google Pay API لتحديد طريقة الدفع.
- في ما يلي أمثلة على النص الوصفي المقبول:
- "شبكة •••• 1234 باستخدام Google Pay"
- "شبكة •••• 1234 (Google Pay)"
- "Google Pay (الشبكة •••• 1234)"
- "Paypal abc...d@gmail.com with Google Pay"
- "طريقة الدفع: Google Pay"
- "تم الدفع باستخدام Google Pay"
وضع كل العناصر معًا
توضّح الصورة التالية عملية دمج مكتملة. يتضمّن الدمج أيضًا خطوة اختيار السلعة/ما قبل الشراء وخطوة المعاملة وخطوة أداة اختيار Google Pay وخطوة ما بعد الشراء.
الحصول على الموافقة
بعد دمج Google Pay API، يجب الحصول على الموافقة على جميع الأماكن التي تعرض فيها Google Pay أو تشير إليها، وذلك للحصول على إذن بالإصدار العلني.
أكمِل قائمة التحقّق الخاصة بعملية الدمج لإرسال عملية دمج الويب للمراجعة. من المفترض أن تتلقّى الموافقة أو الملاحظات في غضون يوم عمل واحد.