设计与主题定制

Design 页面是为所有面向客户的界面统一设置品牌样式的中心枢纽：checkout、storefront 和 Customer Portal。更改会立即应用到这三处，并在保存前实时预览。测试模式和 live 模式使用独立的设计配置 — 请参阅将设计从测试模式复制到 Live 模式。

​

关键亮点

• 统一设计中心 — 从单个页面配置 checkout、storefront 和 Customer Portal 的外观
• 预构建主题 — 从精选主题开始，然后根据需要进行自定义
• 浅色和深色模式 — 为每种模式分别定义配色方案
• 实时预览 — 保存前查看更改在所有界面中的效果
• 按部分覆盖 — 单独微调各个部分，而不会影响其他部分
• 程序化控制 — 在 checkout 时通过 Checkout Sessions API（customization.theme_config）覆盖主题。Session 的 theme_config 优先于控制台设计。Checkout SDK 的客户端 themeConfig 选项已弃用
• 将测试设计复制到正式环境 — 一步即可将您在测试模式中完善的设计移至正式模式

​

快速入门

在你的商家仪表盘中，导航到 设置 → 设计。设计页面有四个标签页：

​

常规设置

General 选项卡控制你的基础品牌识别与全局主题。

​

基础配置

​

高级设置

展开 高级设置 以访问更细粒度的控件：

​

排版

​

色彩配置

分别为浅色模式和深色模式定义颜色调色板。每种模式支持：

​

边框

​

预设主题

Dodo Payments 提供了四款精选主题。在 General 选项卡的 Theme 下拉菜单中选择一项，即可瞬间在结账、在线店面和客户门户上应用统一的设计风格。

​

Dodo Pulses

默认的 Dodo Payments 主题。青柠绿点缀营造出充满活力与清新感。清爽的无衬线排版加上宽松的留白。

​

Terminal

以开发者为导向的主题，采用等宽字体与皇家蓝点缀。锐角设计与技术美学非常适合开发工具和 API 优先的产品。

​

Bumblebee

温暖的琥珀与金色点缀，搭配圆润且现代的样式。醒目且高对比度，适合希望营造高级感的面向消费者的产品。

​

Bubblegum

活泼的粉色与洋红点缀，搭配完全圆角。现代且亲和的外观，适合创意工具、设计类产品与生活方式品牌。

​

分区覆盖

每个区域选项卡（Checkout、Storefront、Customer Portal）都包含 Override Theme 切换。当启用后，可独立定制该区域的外观，而不影响全局主题。

​

结账选项卡

专门为 checkout 体验覆盖字体排版、颜色和边框设置。实时预览显示：

• 产品信息和价格
• 快速 checkout 选项（Apple Pay、Google Pay）
• 支付方式选择和卡片表单
• 折扣码输入和价格明细

​

Storefront 选项卡

配置 storefront 专属设置：

​

Customer Portal 选项卡

为 Customer Portal 覆盖主题，其中包括：

• 订阅管理
• 账单历史记录
• 支付方式
• 钱包和额度

​

将设计从测试模式复制到 Live 模式

测试模式和 live 模式使用独立的设计配置。您在测试期间构建的主题不会自动显示给真实客户。无需手动重新创建，只需一步即可将设计从测试模式复制到 live 模式。

​

相关页面