EN
Shopify 知识库 · 指南

Shopify 官方主题解析:Dawn 与 Horizon

Shopify 官方主题 Dawn 与 Horizon 的源码研究入口:先完成主题基础,再按固定版本或 commit 分析功能、配置与交互,并说明各自验证范围。

官方主题研究用于学习真实实现。每篇源码文章都应说明主题版本或 commit、功能入口、商家配置、相关文件、数据与交互,以及验证方法。

先完成通用基础

按主题结构 → 配置与 Schema → 国际化 → 布局实践阅读,再进入一个实际功能,避免把某个主题的命名当作平台规定。

如何选第一个源码案例

公告栏、图文分区、视频或基于 Custom Elements 的交互组件都适合作为起点。选择一个能观察到前台效果的功能:打开配置,定位文件,追踪状态变化,再验证空值、重复实例和移动视口。

阅读阶段要留下的证据
固定基线仓库、版本或 commit、文件路径
观察功能页面位置、配置与操作结果
解释实现渲染、数据与交互的实际关系
定制验证修改目的、结果、限制与回退方式

当前研究状态

Dawn 已核对 v15.3.0 与 commit ecb06c31f1423fced1b3ea6ef7e1cb2143f04e47,并形成架构解读、数量选择器案例、9 篇功能域源码解读,以及 2026-10-01 新增的 8 篇跨功能写法专题(从 Section Rendering 用法进入;同样固定在该提交,均为静态源码分析)。数量选择器案例包含可重跑的独立浏览器实验,尚未覆盖 Shopify 店铺中的完整加购与编辑器行为。

Horizon 已固定到 4.2.0 的官方 commit 5acd1b6b66c02f61d3216e3adace5dd9e0404fc9(2026-10-07 由 4.1.5 升级,19 篇既有文章已逐篇对照新基线复核),形成 26 篇源码文章。由架构总览进入商品页、购买与变体、商品卡、集合与搜索、购物车、布局、样式和内容模块;源码阅读方法说明怎样校核版本、条件分支和既有结论。另有 7 篇跨功能的写法专题,建议按顺序阅读:Web Components 基类、分区刷新与 morph、带键延迟水合、跨文档 View Transitions、加购竞态处理、服务端对比色与布局抖动治理。当前完成源码核对,未执行店铺交互验证。两套主题的实现不能相互替代。

覆盖矩阵汇总两个固定版本对通用展现与功能模块的覆盖:哪些内置、哪些在全仓库搜索中未找到、哪些尚未核对。

按固定版本学习

Dawn 15.3.0 阅读路线将架构与数量控件实验串联,明确浏览器验证与店铺集成验证的区别。

官方主题源码阅读路线连接 Dawn 与 Horizon 的固定版本文章,按各自验证范围阅读。

平台层面的店面关系见Shopify 店面关系网。

第三方主题对照

官方主题之外,Impact 7.2.0 源码精读选取这款付费主题中六个值得借鉴的实现,包括相邻 section 的间距折叠、变体预取与局部重渲染、购物车事件总线等,可以与 Dawn、Horizon 的同类实现对照阅读。Impact 源码不公开,文中只引用必要片段;结论限于 7.2.0,同样只做了静态源码分析。

基线时效

Dawn 上游已在 2026-08-10 发布 v16.0.0(GitHub Releases 核对),本库 Dawn 正文统一以 v15.3.0 为基线,升级前各篇结论需要重新对照源码核对。Horizon 本库统一以 4.2.0 为基线:2026-10-07 核对时它是上游 main 的最新提交,固定提交中 config/settings_schema.json 的 theme_version 为 4.2.0;上游之后的更新不会自动进入本库,再次升级时同样需要逐篇复核。

内容维护: WooDawn

资料核对:2026-10-07 · 部分核对,适用边界见正文

核对范围:研究方法与当前资料状态;具体源码结论以单篇文章声明的基线和实验为准。

内容更新:2026-10-07