Shopify 知识库 · 概念
结账自定义:Checkout 可扩展性与页面边界
说明 Shopify 结账页、感谢页与订单状态页各自能改到哪一步:checkout and accounts editor 的品牌与设置、Checkout Blocks、UI extensions 与 Functions 的分工、动态结账按钮的位置,以及 checkout.liquid 与 Scripts 的弃用现状,并并列官方页面的差异。
结账、感谢页和订单状态页不属于主题模板,它们有自己的编辑器、扩展机制和套餐门槛;想在这些页面上“加一块内容”,第一步是判断它属于哪一层。本文回答每一层能改什么、谁来改、边界在哪,不回答支付方式是否可用(见支付与结账),也不列出各扩展目标的完整清单。
本库哪些内容依赖它
- 购买旅程:把结账扩展位置与主题、客户账户并列;
- 订单与付款状态、金额排查方法:结账之后的状态与金额核对;
- 信任标志、Payment Options:结账页图标与支付方式定制的前提;
- 交叉销售与追加销售、购买区模块、购物车摘要:结账前后商品优惠、动态结账按钮、订单汇总;
- 折扣、销售计划:Functions 与订阅在结账中的呈现;
- 页面与模板、客户账户、Pixel 与 GTM、购买与事件验证;
- 套餐门槛的汇总见套餐。
本文是该平台机制的权威来源,其他文章只写各自页面语境下的用法。
核心对象与概念
| 对象 | 含义 | 备注 |
|---|---|---|
| Shopify Checkout | 顾客提交配送与付款信息的平台托管结账 | 官方页写明库存在顾客提交付款信息时才被保留 |
| 结账配置(configuration) | 一套结账与账户页的品牌与区块设置,分启用与草稿 | 在 checkout and accounts editor 中编辑;页面写明 Configurations 区域在选定套餐并创建首个商品后才出现 |
| checkout and accounts editor | 与主题编辑器分开的编辑器,覆盖结账、感谢页、订单状态页与客户账户页 | 使用模拟结账环境,不能下单,Pay Now 等操作被停用 |
| 一页式与三页式结账 | 布局选项 | 页面写明默认一页式;两种布局的自定义选项相同,可互相切换 |
| 结账块(block) | 应用提供、可放进编辑器某位置的内容单元 | 每个高亮区域最多 3 个应用 |
| Checkout UI extensions | 向结账流程与订单状态页添加自定义界面 | 开发文档写明面向 Plus;感谢页与订单状态页扩展除 Starter 外各套餐可用 |
| Shopify Functions | 用自定义逻辑扩展或替换 Shopify 后端的关键部分 | 折扣、支付选项、配送选项、校验等 |
| Checkout Branding API | 用 Admin GraphQL 定制结账外观 | 仅 Plus |
| Checkout Blocks 应用 | Shopify 出品的免代码应用 | Basic 及以上仅两类内容块且只在感谢页与订单状态页 |
| Web pixel extensions | 采集顾客行为 | 除 Starter 外各套餐可用;感谢页支持应用像素 |
| Post-purchase 扩展 | 付款之后、确认页之前的新增页 | 开发文档写明处于 beta,开发店不受限,正式店需申请 |
在哪里配置
- 入口:Settings > Checkout,在 Configurations 区点 Edit 打开编辑器,样式、应用块与布局设置都从这里进入;
- 编辑器侧栏:Sections 管功能,Settings 管外观,Apps 管应用块;页面选择器可切换 Checkout、Thank you、Order status、Orders、Profile、Sign-in;三页式布局下另有 Information、Shipping、Payment,勾选 Require a confirmation step 时出现 Review;
- 品牌与设置项(原文菜单名):Logo、Color palette、Main、Header、Order summary、Accent and buttons、Input fields、Typography、Checkout layout、Address autocompletion、Buy again button、Always show discount code field;
- 校验规则:Settings > Checkout 的 Checkout rules,需安装支持校验的应用;
- 支付与配送定制:Settings > Payments 的 Payment customizations、Settings > Shipping and delivery 的 Delivery customizations;
- Post-purchase 页:Settings > Checkout 的 Post-purchase page 区,配置好应用后才显示,同一时间只能选一个应用;
- 按市场调整:编辑器内为已创建的市场做覆盖,Advanced 或 Plus。
与主题、Liquid 和 API 的连接
| 入口 | 官方页面所写 |
|---|---|
| 主题模板 | 结账不由主题模板渲染;checkout.liquid 曾是 Plus 独有的主题布局文件,见下文弃用现状 |
payment_button | 用在商品表单上,商品页输出单个动态结账按钮;官方页写明按钮显示在 Add to cart 旁,只能购买单个变体 |
additional_checkout_buttons / content_for_additional_checkout_buttons | 购物车页先判断前者,再输出后者以显示店铺启用的全部加速按钮 |
| 加速结账区 | 帮助页写明加速按钮显示在结账开头的 Express Checkout 区,按最快方式动态排序;Plus 店铺可用自定义应用经 Payment Customization API 按条件隐藏 |
purchase.thank-you | 感谢页扩展目标;此时订单尚未创建但订单 ID 可用,用 OrderConfirmationApi 取确认号或订单 ID |
customer-account.order-status | 订单状态页扩展目标;订单始终可用,用 OrderStatusApi |
| Admin GraphQL | checkoutBrandingUpsert 与 checkoutAndAccountsConfigurationUpdate 定制外观,均限 Plus;后者一份配置同时管结账、客户账户与登录 |
| Cart Transform API | 官方页写明其对购物车行的价格与商品呈现调整也作用于感谢页与订单状态页 |
| Customer Privacy API | 自定义应用可用它增强 cookie 同意体验,见隐私与同意 |
限制、数值与易错点
核验于 2026-09-29,逐条标来源;官方页面表述不一致处并列。套餐条件汇总见套餐,此处只写与页面边界相关的部分。
- 三类可改的东西不要混。 外观(Logo、颜色、字体、布局)在编辑器里改,Basic 及以上;块与应用来自应用商店,信息、配送、支付页的应用仅 Plus,感谢页与订单状态页的应用 Basic 及以上(结账自定义总览);逻辑(折扣、支付与配送选项、校验)由 Functions 承担,公共应用各套餐可用、含 Function API 的自定义应用仅 Plus(结账自定义)。
- Checkout Blocks 不是“仅 Plus”。 官方页写明 Basic 及以上可用动态内容块与静态内容块,且只能放在感谢页与订单状态页,其余功能仅 Plus。
- 背景图已收紧。 结账样式页写明自 2026-02-05 起不能再为结账页头或主内容区添加背景图,已有图片只能移除,移除后不能再加,且只能在店铺默认设置中移除;订单汇总区的背景图与颜色仍可设置。
- 同一高亮区域最多 3 个应用; post-purchase 同一时间只能用一个应用。
- 感谢页扩展不能改订单。 开发文档写明 UI extension 不支持直接修改订单的 API;需要改动订单时考虑 post-purchase 扩展。感谢页只显示一次,之后顾客看到的是订单状态页;订单状态页官方归为客户账户页,顾客一段时间内可免登录查看,之后链接失效并显示脱敏视图(自定义选项,具体时长该页未写)。
- 按市场:两页并列。 按市场调整页把“在订单状态页为特定市场推广促销”列为示例;感谢页与订单状态页自定义选项页在 Cross-border 一节写明这两页不支持按市场定制。本文不选边,使用前在编辑器里实测。
- 支付方式定制。 需第三方应用;美国与加拿大的非 Plus 店铺只能改非信用卡方式;对草稿订单结账同样生效,但创建草稿订单时后台不显示(结账自定义)。
- 动态结账按钮的分工。 商家只能显示或隐藏按钮,不能选择品牌或非品牌形态,仅非品牌按钮可改颜色与字体(加速结账按钮);哪些钱包可用、与销售计划的关系见支付与结账,本文只管位置。
- checkout.liquid 与 Scripts 的弃用现状(两页并列)。 开发文档写明
checkout.liquid对信息、配送、支付三步已不受支持;对感谢页与订单状态页,checkout.liquid与 additional scripts 于 2025-08-28 停用,script tags 在这两页对 Plus 于 2025-08-28 停用、对非 Plus 于 2026-08-26 停用(checkout.liquid)。帮助中心的非 Plus 升级指南写明 2026-08-26 是非 Plus 店铺升级感谢页与订单状态页的截止日,2025-08-28 起 additional scripts 区域只读,暂停店铺时这两页被自动升级且不可逆(升级指南)。两处并不完全对应:开发文档说 2025-08-28 起两页的checkout.liquid与 additional scripts 已停用,帮助中心则以 2026-08-26 为非 Plus 店铺的升级截止日;本文不选边。核验日(2026-09-29)两个日期都已过去。Shopify Scripts 另写明自 2026-06-30 起已弃用,仍发布的脚本已被停用,应迁移到 Functions(Scripts)。 - “结账外观在哪里改”的表述不一致。 Shopify Checkout 概览页写可“通过编辑在线商店主题”改结账外观与布局,checkout.liquid 页写非 Plus 店铺在主题编辑器中自定义结账页,编辑器页则写这些页面在“与主题编辑器分开”的编辑器里管理。本文按编辑器页处理;编辑器内的 Online store theme 入口只是跳转到主题编辑器。
验证一次
- 在 Settings > Checkout 确认 Configurations 是否可用、当前是一页式还是三页式;
- 改外观前先复制配置做草稿备份,保存后在真实结账页核对;编辑器是模拟环境,不能证明真实结账;
- 装一个感谢页块,确认在 Apps 侧栏里它可加到哪些页面(官方写法:点块旁的 + 查看可加页面);
- 用官方测试单走一遍结账,记录动态结账按钮出现的位置与条件、感谢页与订单状态页各自显示什么;
- 换地址与市场再走一遍,核对按市场覆盖是否在结账页、感谢页、订单状态页分别生效(第 6 条);
- 有旧
additional scripts或checkout.liquid的店铺,逐项核对其在新页面上的替代方案,再对照事件验证确认像素仍触发。
待继续完善
- 各 UI extension 目标、组件与可放位置的完整清单未读;
- 订单状态页免登录时长、Review 步骤的完整行为未核验;
- 按市场覆盖对感谢页与订单状态页的实际支持范围需实测(第 6 条);
- 菜单名未在真实店铺核对;2026-08-26 之后非 Plus 店铺感谢页的实际状态未验证。