shopify-liquid-themes

Installation
Summary

Generate Shopify Liquid theme code with correct schema, translations, and component patterns.

  • Covers sections, blocks, and snippets with proper {% schema %} JSON, LiquidDoc headers, and translation key usage via the t filter
  • Includes 77+ language filters, 45+ HTML/media filters, 30+ commerce filters, and 30 tags with syntax and parameters
  • Provides CSS/JavaScript patterns using {% stylesheet %}, {% javascript %}, and {% style %} tags for dynamic styling
  • Details all 33 setting types (checkbox, text, color picker, product picker, etc.) with visible_if conditional rendering for editor UI
SKILL.md

Shopify Liquid Themes

Theme Architecture

.
├── sections/    # Full-width page modules with {% schema %} — hero, product grid, testimonials
├── blocks/      # Nestable components with {% schema %} — slides, feature items, text blocks
├── snippets/    # Reusable fragments via {% render %} — buttons, icons, image helpers
├── layout/      # Page wrappers (must include {{ content_for_header }} and {{ content_for_layout }})
├── templates/   # JSON files defining which sections appear on each page type
├── config/      # Global theme settings (settings_schema.json, settings_data.json)
├── locales/     # Translation files (en.default.json, fr.json, etc.)
└── assets/      # Static CSS, JS, images (prefer {% stylesheet %}/{% javascript %} instead)

When to use what

| Need | Use | Why |

Related skills
Installs
2.2K
GitHub Stars
107
First Seen
Feb 23, 2026