以下指南详细介绍了如何在您自己的网站中引用 Google Pay 品牌。
Google Pay 付款按钮
Google Pay 付款按钮必须始终调用 Google Pay API。Google Pay API 会显示付款表格，用户可以在其中选择付款方式。
素材资源
createButton() JavaScript 方法可动态插入 CSS 规则以及从 Google CDN 加载的用于 HTML <button> 元素的 SVG 文件。
所有显示在您网站上的 Google Pay 付款按钮都必须遵守我们的品牌推广指南，包括但不限于以下要求：
- 大小必须与页面上其他类似按钮或元素相匹配。您可以使用
createButtonAPI 的buttonSizeMode选项来调整按钮大小。 - 按钮颜色必须与周围区域的背景颜色形成鲜明对比。
- 该按钮的四周都必须始终留出最小留白空间。
如果这种便捷方法或支持的语言不符合您的需求，请联系我们。
银行卡信息
银行卡信息变体会自动显示可用银行卡品牌的网络以及银行卡的最后四位数。如需了解详情，请参阅 ButtonOptions。
“通过 Google Pay 购买”
“通过 Google Pay 购买”变体会自动以支持的语言显示已翻译的按钮，该按钮与查看者的浏览器设置相符。如需了解详情，请参阅 ButtonOptions。
“通过 Google 进行捐款”
“通过 Google 进行捐款”变体会自动以支持的语言显示已翻译的按钮，该按钮与查看者的浏览器设置相符。如需了解详情，请参阅 ButtonOptions。
样式
Google Pay 付款按钮有两种变体：黑色和白色。每个变体都有带“购买方式”文本和不带“购买方式”文本两种版本。资源中提供了带有“购买方式”文本本地化版本的付款按钮。Google Pay 品牌名称始终未翻译。请勿以自行本地化的文字创建按钮。
| 黑色 | 白色 |
|---|---|
 |
 |
 |
 |
 |
 |
 |
 |
白色或浅色背景可使用黑色按钮，以形成对比。 |
深色或彩色背景可使用白色按钮。 |
留白
请务必在付款按钮的四周留出至少 8 dp 的留白空间。确保留白空间永远不会被图形或文本破坏。
示例
| 如果您将 Google Pay 按钮放在另一个按钮旁边，请确保 Google Pay 按钮大小相等。 | 始终使用与其显示背景形成对比的 Google Pay 按钮。 |
| 当您调整 Google Pay 按钮的大小时，请始终遵循高度、宽度和内边距规则。 |
注意事项
| 正确做法 | 错误做法 |
|---|---|
|
|
Google Pay 标识
当您在付款流程中将 Google Pay 用作付款选项时，请仅使用这些指南中提供的 Google Pay 标识。
素材资源
点击以下按钮即可以 SVG 文件格式下载 Google Pay 标识：
下载资源标识
当您将 Google Pay 显示为付款选项时，请使用以下 Google Pay 标识：
如果您对其他品牌也采取了这种做法，请在该标识旁边的文本中显示“Google Pay”。请勿更改标识边框的颜色或粗细，或以任何方式更改该标识。请仅使用 Google 提供的标识。
留白
在 Google Pay 受理标记四周，始终留出不少于字母 G 徽标高度一半（0.5 倍）的留白空间。请确保您展示的任何其他品牌标识也采用等同的留白空间。
大小
调整高度以与付款流程中显示的其他品牌标识相一致。请勿将 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，使用 Google Pay”
- “付款方式：Google Pay”
- “已通过 Google Pay 付款”
总结
完成的集成的屏幕截图如下图所示。集成还包括商品选择/购物前步骤、交易步骤、Google Pay 选择器步骤以及购物后步骤。
获得批准
集成 Google Pay API 之后，您需要获得在您的网站内显示或引用 Google Pay 的所有地方的批准，以便获得正式版访问权限。
完成我们的集成核对清单，提交您的网页集成请求以供审核。您应该会在 1 个工作日内获得批准或反馈。