该技能用于生成 Shopify Liquid 主题代码,涵盖 sections、blocks、snippets 三类模块,要求正确编写 schema JSON、LiquidDoc 头、翻译键与 CSS/JS 模式。
主题目录分为 sections(带 {% schema %} 的全宽模块)、blocks(可嵌套组件)、snippets(通过 {% render %} 复用的片段)、layout(页面包装,需含 {{ content_for_header }} 和 {{ content_for_layout }})、templates(JSON 模板)、config(全局设置)、locales(翻译文件)、assets(静态资源)。选择依据:需商家可编辑的全宽模块用 section;小型可嵌套组件用 block;复用逻辑用 snippet,且 block 不能 render 其他 block。
Liquid 使用 {{ }} 输出、{% %} 逻辑标签,支持空白裁剪。注意:条件中不能用括号,无三元运算符,for 循环最多 50 次,contains 仅适用于字符串,{% stylesheet %}/{% javascript %} 不渲染 Liquid,snippet 不能访问外部作用域变量,include 已弃用,应使用 {% render %}。
资料还列出常用数组、字符串、数学、货币、颜色、媒体、URL、HTML、本地化过滤器,以及主题、控制、迭代、变量、HTML、文档类标签与全局及页面级对象。
schema 中 sections 用 section.settings.,blocks 用 block.settings.,并提供 name、tag、class、limit、settings、max_blocks、blocks、presets、enabled_on 等字段;设置类型包括 checkbox、text、textarea、richtext、range、select、radio、color、image_picker、product、collection、url、link_list、font_picker 等,可用 visible_if 条件显示。
CSS/JS 方面,{% stylesheet %}/{% javascript %} 每个文件各一个标签且不处理 Liquid;动态 CSS 用 {% style %}。snippets 始终需要 {% doc %},含 @param 与 @example。所有面向用户的字符串必须用 t 过滤器,翻译文件含 en.default.json、en.default.schema.json 等,键用 snake_case、层级不超过 3 层,schema 标签用 t: 前缀。