案例作品集 浏览精选项目

WESWOO 提供 Shopify Plus 项目开发费抵扣,至多 US$4,800

开发知识库 / 数据与实现基础

数据与实现基础

先确定模块读什么、由谁维护,再选择 Liquid 或 Headless。

规格、政策与资料共用

先写字段字典,区分商品共用事实、变体差异和可复用对象。代码只读取已公开且有值的记录,商品、系列、帮助与摘要引用同一事实来源。

数据与依赖

  • custom.specification_rows:list.metaobject_reference。
  • 每行定义 label、spec_value、unit,均为单行文本。

交互逻辑

  • 草稿、缺值或移除引用时,按记录状态处理。
  • 变体独有的值应由对应变体读取。
示例代码 · snippets/ww-specifications.liquid
Liquid · WESWOO
{% assign rows = product.metafields.custom.specification_rows.value %}
{% if rows != blank %}
  <table>
    <caption>{{ product.title | escape }} — specifications</caption>
    <tbody>
      {% for row in rows %}
        {% if row.label.value != blank and row.spec_value.value != blank %}
          <tr>
            <th scope="row">{{ row.label.value | escape }}</th>
            <td>{{ row.spec_value.value | escape }} {{ row.unit.value | escape }}</td>
          </tr>
        {% endif %}
      {% endfor %}
    </tbody>
  </table>
{% endif %}

验收检查

  • 用同一参数核卡片、规格表和说明。
  • 修改单位或值后检查全部引用。

custom 字段名是示例定义;后台未建立、未赋值或未开放读取时,片段不会自动产生资料。

先理解,再整合,最后验证

  1. 选择模块,确认数据和输入输出。
  2. 将片段接入当前主题或框架。
  3. 用真实变体、市场和失败恢复场景验收。

示例按 Shopify Online Store 2.0 主题编写;Headless 使用单独的数据与版本边界。代码片段需接实际字段、主题和语言文件。

架构参考

示例由 WESWOO 编写,结合 Shopify 官方文档和固定版本的仓库参考。采用仓库代码时应保留适用许可。

Shopify/dawn · 许可commit 3e9ee2281dc4 · Shopify 集成主题的限定许可;参考架构,不复制仓库实现。
Shopify/hydrogen · 许可commit 9e358a2462ba · MIT;采用实质代码时保留版权与许可。

依据核对 2026-11-12