精益求精

Shopify 2025 主题原理讲解和 8 个文件夹解析

对于 Shopify 从业者来说，了解主题的基本架构和工作原理很有必要，即使不打算成为主题开发人员。这样不仅能提升工作效率，还能在与同事和上级交流时展现专业素养。

从实际业务需求出发去理解 Shopify 主题，比单纯从技术角度学习要更有价值。虽然 Shopify 官方英文文档内容丰富，但对新手来说往往显得过于冗长和专业。

因此，我准备分享这篇教程，力求用最简单明了的方式，从店铺运营和实际应用的视角，全面介绍 Shopify 主题的核心概念。这篇教程将技术知识与实际运营场景紧密结合，让读者无需深入研究繁琐的技术细节，也不用再去查阅其他资料，就能掌握 Shopify 主题的精髓。

Shopify 主题结构图

theme.liquid中添加的代码除了结账页外，在 Shopify 网站的所有页面都会生效，所以像营销和分析代码都是加在这个文件中，例如 Google Tag Manager 的代码。
2.0 版之前的 Shopify 插件代码也可能加在 theme.liquid 中，但现在大多不需要这样操作了，改成了在 Shopify 主题编辑器 ~ 应用嵌入中开启。
使用新的 layout 文件可以用于创建 Landing Page 之类的需求（见视频演示）

Shopify Winter 2025 版本之后正式上线的文件夹，目前还没有在新版官方主题中得到体现。上线之后，blocks 分为三大类：
- Theme blocks: 在 blocks 文件夹创建，可以在不同的 sections 中使用。
- Section blocks: 只在某个 Section（分区）中使用的 block，例如：
  产品页面的 title，用于展示产品标题。
- App blocks: 由店铺安装的插件提供，用于 Shopify Apps 的对应功能。
对 Shopify 新版 blocks 感兴趣的话可以参考官方文档进行体验：

<h2>{{ product.title | escape }}</h2>

{% render 'title' %}

{{ 'base.css' | asset_url | stylesheet_tag }}

<script src="{{ 'global.js' | asset_url }}" defer="defer"></script>

💡

提示：增强版主题或者 Shopify 官方 2.0 主题，例如 Dawn 等，添加 CSS 样式代码都可以加到 assets 文件夹 ~ base.css 文件底部。