تنظيم صفحاتك في مجموعات
يمكنك حفظ المحتوى وتصنيفه حسب إعداداتك المفضّلة.
تهدف هذه الإرشادات إلى مساعدتك في استخدام Google Wallet API في تطبيقاتك أو مواقعك الإلكترونية.
زر "الحفظ في Google Pay"
يجب أن يستدعي زر الحفظ في Google Pay أحد مسارات Google Pay API for
البطاقات. تعرض هذه المسارات شاشة يمكن للمستخدمين من خلالها حفظ بطاقات صعود الطائرة، وتذاكر الفعاليات أو
بطاقات النقل العام، وبطاقات الولاء، وبطاقات الهدايا والعروض على جهاز Android الخاص بهم. يمكن استخدام هذا الزر في تطبيقات التجّار أو المواقع الإلكترونية أو الرسائل الإلكترونية أو الرسائل القصيرة.
يجب أن تكون جميع أزرار الحفظ في Google Pay التي تظهر على موقعك الإلكتروني أو تطبيقك أو مراسلاتك عبر البريد الإلكتروني متوافقة مع إرشادات العلامة التجارية الموضّحة في هذه الصفحة.
وتتضمن، على سبيل المثال لا الحصر، ما يلي:
الحجم مقارنةً بالأزرار أو العناصر المشابهة الأخرى في الصفحة
التباين مع لون خلفية المنطقة المحيطة
المساحة الخالية
تتوفّر أزرار الحفظ في Google Pay باللغات التالية: العربية والكرواتية والتشيكية والدانمركية والهولندية والإنجليزية والفنلندية والفرنسية والألمانية والإندونيسية والإيطالية واليابانية والكورية والنرويجية (بوكمال) والبولندية والبرتغالية والروسية والصينية المبسّطة والسلوفاكية والإسبانية والسويدية والتايلاندية والصينية التقليدية والأوكرانية.
حجم الملف
اضبط ارتفاع وعرض زر الحفظ في Google Pay ليلائم التنسيق. إذا كانت هناك أزرار أخرى على الصفحة، يجب أن يكون حجم زر الحفظ في Google Pay مساويًا لحجم هذين الزرَين أو أكبر منه. لا تجعل زر الحفظ في Google Pay
أصغر من الأزرار الأخرى.
النمط
تتوفّر أزرار الحفظ في Google Pay بثلاثة أشكال: الأسود والأبيض والأبيض مع مخطط أسود. يتم توفير أزرار ذات نُسخ مترجَمة من النص.
لا تنشئ أزرارًا باستخدام نصّك المترجَم.
أسود
بالأبيض
أبيض مع مخطط
استخدِم الزر الأسود على خلفيات بيضاء أو فاتحة اللون لتوفير التباين. ولا تستخدم الزر الأسود على خلفيات داكنة اللون. بدلاً من ذلك، استخدِم الزر الأبيض.
يمكنك استخدام الزرّ الأبيض على خلفيات داكنة أو ملوّنة. ولا تستخدِم الزر الأبيض على خلفيات بيضاء أو فاتحة. بدلاً من ذلك، استخدم الزر الأسود أو الزر الأبيض مع مخطط.
استخدِم الزر الأبيض مع مخطط كبديل للزر الأسود على الخلفيات البيضاء أو الفاتحة. لا تستخدِم هذا الزر على خلفيات داكنة أو ملوّنة، بل استخدِم الزر الأبيض العادي بدلاً من ذلك.
المساحة الخالية
يجب دائمًا إبقاء الحد الأدنى من المساحة الخالية 8 وحدات بكسل مستقلة الكثافة على جميع جوانب زر الحفظ في Google Pay. تأكَّد من أنّ المساحة الخالية غير مقسّمة بالرسومات أو النصوص.
الحد الأدنى للارتفاع
يجب أن يبلغ ارتفاع جميع أزرار الحفظ في Google Pay 36 وحدة بكسل مستقلة الكثافة (dp) كحد أدنى.
افعل ولا تفعل
الإجراءات المستحسنة
الإجراءات غير المستحسنة
ما يجب فعله: استخدِم فقط أزرار الحفظ في Google Pay
التي توفّرها Google.
لا تفعل: لا تنشئ أزرار الحفظ في 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 في النص
يمكنك استخدام النص للإشارة إلى المستخدم بأنّه تم حفظ بطاقة صعود الطائرة أو تذكرة الفعالية أو
النقل العام أو بطاقة الولاء أو بطاقة الهدايا أو العرض على جهازه.
كتابة الحرفين "G" و "P" بالأحرف اللاتينية الكبيرة
للإشارة إلى Google Pay، يجب دائمًا استخدام حرف "G" كبير وحرف "P" كبير متبوع بحروف صغيرة. لا تكتب الاسم الكامل "GOOGLE PAY" بالأحرف اللاتينية الكبيرة ما لم يكن مطابقًا
للنمط الطباعي في واجهة المستخدم.
عدم اختصار Google Pay.
اكتب دائمًا الكلمات "Google" و "Pay".
مطابقة النمط في واجهة المستخدم الخاصة بك
اضبط Google Pay بنفس الخط والنمط الطباعي لبقية النص في واجهة المستخدم.
لا يجوز تقليد النمط الطباعي في Google.
عدم ترجمة Google Pay
يجب كتابة Google Pay باللغة الإنجليزية دائمًا. يُرجى عدم ترجمتها إلى لغة أخرى.
تاريخ التعديل الأخير: 2025-09-04 (حسب التوقيت العالمي المتفَّق عليه)
[[["يسهُل فهم المحتوى.","easyToUnderstand","thumb-up"],["ساعَدني المحتوى في حلّ مشكلتي.","solvedMyProblem","thumb-up"],["غير ذلك","otherUp","thumb-up"]],[["لا يحتوي على المعلومات التي أحتاج إليها.","missingTheInformationINeed","thumb-down"],["الخطوات معقدة للغاية / كثيرة جدًا.","tooComplicatedTooManySteps","thumb-down"],["المحتوى قديم.","outOfDate","thumb-down"],["ثمة مشكلة في الترجمة.","translationIssue","thumb-down"],["مشكلة في العيّنات / التعليمات البرمجية","samplesCodeIssue","thumb-down"],["غير ذلك","otherDown","thumb-down"]],["تاريخ التعديل الأخير: 2025-09-04 (حسب التوقيت العالمي المتفَّق عليه)"],[[["\u003cp\u003eThese guidelines provide instructions for implementing the Google Wallet API to enable users to save passes to Google Pay within apps or websites.\u003c/p\u003e\n"],["\u003cp\u003eThe "Save to Google Pay" button must adhere to specific brand guidelines, including size, style, and clear space requirements, and should be used consistently.\u003c/p\u003e\n"],["\u003cp\u003eStrategic button placement is crucial, with recommendations for optimal placement near loyalty information, purchase confirmations, and offer displays to maximize saved objects.\u003c/p\u003e\n"],["\u003cp\u003eWhen referring to Google Pay in text, ensure to capitalize "G" and "P", avoid abbreviations and translations, and maintain consistency with your overall UI style.\u003c/p\u003e\n"]]],["The guidelines detail how to use the \"Save to Google Pay\" button within apps, websites, or emails. These buttons, available in EPS and SVG formats, must adhere to specific size, style, and clear space requirements. They must link to Google Pay API flows, be equal to or larger than other buttons, and contrast with the background. The button is available in black, white, or white with outline. The name \"Google Pay\" should be used as described and must remain untranslated. Proper button placement near loyalty information, offers, and ticket confirmations is also key.\n"],null,["# Button guidelines\n\nThese guidelines are meant to help you implement the Google Wallet API within your\napps or websites.\n\nSave to Google Pay button\n-------------------------\n\nThe **Save to Google Pay** button must call one of the Google Pay API for\nPasses flows. These flows surface a screen where users can save boarding passes, event or\ntransit tickets, loyalty cards, gift cards, and offers to their Android device. This button\ncan be used in merchant apps, websites, emails, or SMS.\n\n### Assets\n\nThe **Save to Google Pay** buttons are available as EPS and SVG files.\n\n[Download assets - EPS](/static/wallet/download-assets/Save_to_Google_Pay_eps.zip)\n[Download assets - SVG](/static/wallet/download-assets/Save_to_Google_Pay_svg.zip)\n\nAll **Save to Google Pay** buttons displayed on your site, app, or email\ncommunications must adhere to our brand guidelines, which are described on this page.\nThey include, but aren't limited to, the following:\n\n- Size relative to other similar buttons or elements of the page\n- Contrast with the background color of the surrounding area\n- Clear space\n\nThe **Save to Google Pay** buttons are available in the following languages: Arabic,\nCroatian, Czech, Danish, Dutch, English, Finnish, French, German, Indonesian, Italian,\nJapanese, Korean, Norwegian (Bokmal), Polish, Portuguese, Russian, Simplified Chinese,\nSlovak, Spanish, Swedish, Thai, Traditional Chinese, and Ukranian.\n\n### Size\n\nAdjust the height and width of the **Save to Google Pay** button to fit your layout. If\nthere are other buttons on the page, the **Save to Google Pay** button needs to be equal\nin size to or larger than these buttons. Do not make the **Save to Google Pay** button\nsmaller than other buttons.\n\n### Style\n\nThe **Save to Google Pay** buttons are available in three variations: black, white, and white\nwith a black outline. Buttons with localized versions of the text are provided.\nDo not create buttons with your own localized text.\n\n|---------------------------------------------------------------------------------------------------------------------------------------------------------|-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|\n| | | |\n| Black | White | White with outline |\n| Use the black button on white or light backgrounds to provide contrast. Do not use the black button on dark backgrounds. Instead, use the white button. | Use the white button on dark or colorful backgrounds. Do not use the white button on white or light backgrounds. Instead, use the black button or the white button with an outline. | Use the white button with an outline as an alternative to the black button on white or light backgrounds. Do not use this button on dark or colorful backgrounds; use the standard white button instead. |\n\n### Clear space\n\nAlways maintain the minimum clear space of 8 dp on all sides of the **Save to Google Pay**\nbutton. Ensure that the clear space is never broken with graphics or text.\n\n### Minimum height\n\nAll **Save to Google Pay** buttons need to have a minimum height of 36 dp.\n\n### Dos and don'ts\n\n| Dos | Don'ts |\n|-----------------------------------------------------------------------------------------------------------------------|-----------------------------------------------------------------------------------------------------------------------------------------------|\n| Do: Use only the **Save to Google Pay** buttons provided by Google. | Don't: Don't create your own **Save to Google Pay** buttons or alter the font, color, button radius, or padding within the button in any way. |\n| Do: Use the same style of button throughout your site. Button color may adapt if the color of the background changes. | Don't: Don't make the **Save to Google Pay** buttons smaller than other buttons. |\n| Do: Ensure that the size of the **Save to Google Pay** buttons remains equal to or larger than other buttons. | Don't: Don't use a button color that's similar to the background. For example, don't use the white button on a white background. |\n| Do: Ensure that you choose a button color that contrasts with your background. | Don't: Don't free scale the button. |\n| Do: Keep the button ratio the same when resizing the **Save to Google Pay** buttons. | |\n\nBest practices for button placement\n-----------------------------------\n\nTo maximize the number of saved objects, display the **Save to Google Pay** buttons\nprominently within your app, website, or email. You need to adhere to the following best\npractices in order to receive brand approval from Google.\n\n### Loyalty cards\n\nWe recommend that you place the **Save to Google Pay** button near user experiences\nin your app, site, or email communication where you display current customer loyalty\ninformation. It's also useful to display the button on confirmation screens that surface\nright after users sign up for your loyalty program in your app or website.\n\n### Gift cards\n\nWe recommend that you place the **Save to Google Pay** button on the confirmation\nscreen that surfaces after a user purchases a gift card in your app or website. It's\nalso a good idea to display the button in any email communication delivered to the\ngift card recipient.\n\n### Offers\n\nWe recommend that you place the **Save to Google Pay** button near screens or pages\nin your app or website where users access offers. For better results, it's highly recommended\nthat you include the button in any email communication about the offer.\n\n### Event and transit tickets\n\nDisplay the **Save to Google Pay** button at the end of your purchase flow or on\nconfirmation app screens, web pages, or emails. We recommend that you place the\n**Save to Google Pay** button where users access their tickets in your app or website.\n\n### Boarding passes\n\nDisplay the **Save to Google Pay** button at the end of your purchase flow or on\nconfirmation app screens, web pages, or emails. You can also display the button where\npassengers check in to their flights or view their boarding passes on your website or\napp, or include it in relevant emails.\n\nUse of the Google Pay product name in text\n------------------------------------------\n\nYou can use text to indicate to the user that their boarding pass, event or transit\nticket, loyalty card, gift card, or offer has been saved to their device.\n\n### Capitalize the letters \"G\" and \"P\"\n\nAlways use an uppercase \"G\" and an uppercase \"P\" followed by lowercase letters to\nrefer to Google Pay. Don't capitalize the full name \"GOOGLE PAY\" unless it's to match\nthe typographic style in your UI.\n\n### Don't abbreviate Google Pay\n\nAlways write out the words \"Google\" and \"Pay.\"\n\n### Match the style in your UI\n\nSet \"Google Pay\" in the same font and typographic style as the rest of the text in your UI.\nDo not mimic Google's typographic style.\n\n### Don't translate Google Pay\n\nAlways write \"Google Pay\" in English. Do not translate it to another language."]]
