如何自定义支付中心

运行机制

您可自定义以下参数来设置支付UI的外观:

  • 屏幕上显示的位置
  • 主题
  • 大小
  • 背景
  • 预加载器

UI参数可通过令牌和小组件集成脚本进行设置。

如何获取

要通过令牌来自定义支付UI,请更改settings.ui对象的参数:
API参考
查看完整参数列表。
参数类型描述
settings.ui.themestring支付UI的外观主题。可以是'default'(默认值)或'default_dark'。
settings.ui.sizestring支付UI的大小。此参数可拥有以下值之一,具体取决于支付UI的所需大小:
  • small:支付UI支持的最小尺寸。当窗口大小严格受限时,请使用此值(尺寸:620 x 630)
  • medium:支付UI的推荐大小。使用此值可以在灯箱中显示支付UI(尺寸:740 x 760)
  • large:在新窗口或者选项卡中显示支付UI的最佳大小(尺寸:820 x 840)
settings.ui.desktop.header.visible_logoboolean如果为'true',标题中将显示Logo(请先把Logo文件提供给您的项目经理)。
settings.ui.desktop.header.visible_purchaseboolean是否在标题中显示购买描述(purchase.description.value)。默认为‘true’。
要自定义小组件,请更改lightbox对象的参数:
API参考
查看完整小组件初始化参数列表。
参数类型描述
lightbox.widthstringLightbox框架的宽度。如果为null,则取决于支付中心的宽度。默认值为null。
lightbox.heightstringlightbox框架的高度。如果为null,则取决于支付中心的高度。默认值为'100%'。
lightbox.zIndexinteger控制垂直堆叠顺序的属性,默认值为1000。
lightbox.overlayOpacityinteger叠加的不透明度(从0到1),默认值为'0.6'。
lightbox.overlayBackgroundstring叠加的背景,默认值为'#000000'。
lightbox.contentBackgroundstring框架的背景,默认值为'#ffffff'。请注意,颜色更改不会影响支付中心iframe本身,只会影响容纳iframe的灯箱的设置。
lightbox.spinnerstring加载过程显示控件的动画类型。可为'xsolla'或'round'。默认值为'xsolla'。
lightbox.spinnerColorstring旋转加载动画的颜色,非默认设置。

继续阅读