Communitygithub.com

benjaminsehl/liquid-theme-standards

Shopify Liquid 主题的 CSS、JavaScript 和 HTML 编码规范。涵盖样式标签内的 BEM 命名法、设计令牌、CSS 自定义属性、Web 组件、防御性 CSS 和渐进式增强。适用于编写 .liquid 文件或主题资源文件中的 CSS/JS/HTML。

liquid-theme-standards 是什么?

该技能为 Shopify Liquid 主题开发提供了全面的 CSS、JavaScript 和 HTML 编码标准。它基于 BEM 命名约定,确保样式标签内的类命名一致性;引入设计令牌和 CSS 自定义属性,实现跨页面的主题化与品牌统一;推荐使用 Web 组件来封装可复用的 UI 逻辑,并采用防御性 CSS 和渐进式增强策略,确保主题在老旧浏览器上仍能正常工作。该规范支持所有 Shopify 主题开发场景,包括 .liquid 布局文件、片段文件和资源文件,旨在提升代码质量、可维护性和跨浏览器兼容性。它适合与 Claude Code、Cursor 或 Codex 等 AI 代理一起使用,以生成符合标准的主题代码。

兼容平台~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/benjaminsehl/liquid-skills/tree/main/skills/liquid-theme-standards

在你喜欢的 AI 中提问

打开一个已预加载此 Agent Skill 的新对话。

文档

liquid-theme-standards 是做什么的?

Shopify Liquid 主题的 CSS、JavaScript 和 HTML 编码规范。涵盖样式标签内的 BEM 命名法、设计令牌、CSS 自定义属性、Web 组件、防御性 CSS 和渐进式增强。适用于编写 .liquid 文件或主题资源文件中的 CSS/JS/HTML。

Individual skills in this repo

This repo contains 2 individual skills — each has its own dedicated page.

相关技能