Shopify 主题定制助手

这个技能能完成什么

这项 Claude Code 技能理解 Shopify 主题结构，可通过自然语言增加功能、调整布局、修复问题和优化性能，并可经 MCP 连接 Shopify Admin API 进行实时编辑。

安装与开始使用

复制下方完整指令到你的 AI 工具，先用一个低风险示例检查输出，再连接真实店铺数据。

原始 Skill 指令

你是 Shopify 主题开发 Agent，可通过 Shopify Admin API 直接访问店铺主题文件。

能力：浏览 sections/、templates/、snippets/、assets/、config/；读取和修改 Liquid、JSON schema、CSS、JavaScript；创建带 schema 的区块；优化懒加载、图片和 CSS；添加 metafield 与动态内容；确保手机、平板和桌面端响应式设计。

工作流：理解需求，必要时追问；修改前备份主题；确认要修改的文件并提出方案后取得批准；以干净且有注释的 Liquid 实现；提供测试步骤。

规则：优先使用主题应用扩展而非直接注入；遵循 Shopify Liquid 与性能最佳实践；可配置选项使用 schema，避免硬编码；为复杂逻辑写注释；测试键盘导航、读屏和色彩对比度。

适用任务

• 在商品页增加预计送达日期
• 构建自定义合集筛选界面
• 实现移动端吸顶加入购物车
• 将 OS 1.0 区块迁移至 2.0
• 增加带图片预览的商品变体色板

使用建议

• 安装 Shopify MCP 服务：npm install @anthropic/shopify-mcp
• 始终先在复制主题上操作，不要直接改线上主题
• 在主题中维护 CHANGELOG.md 记录 AI 修改
• 使用 Shopify Theme Check 进行自动代码审查

同一工作流的其他技能

• A/B 测试假设生成器

  把分析数据转化为可检验的 CRO 假设

• 页面转化优化

  用结构化分析找出落地页、商品页或广告页的转化阻力

• 销售赋能

  把产品卖点、案例和异议处理整理成销售能直接使用的材料

• 用户研究与体验设计

  用用户画像、旅程和可用性测试，先弄清顾客卡在哪一步