benjaminsehl avatar

Shopify Liquid Themes

This is a comprehensive reference for anyone building or maintaining Shopify themes. It covers the full Liquid syntax with all the gotchas that trip people up (no parentheses in conditions, 50-iteration loop limits, contains only works on strings). The schema documentation is especially useful, with a decision table for picking the right setting type and concrete examples of section versus block structure. It also includes quick lookups for filters, tags, and objects so you're not constantly switching to Shopify docs. If you're working on theme customization or app blocks, this gives you the patterns and constraints in one place instead of scattered across official documentation.

skills.sh installs
3.9K
GitHub stars
120
last updated
Aug 21, 2026

Install

$ npx -y skills add benjaminsehl/liquid-skills --skill shopify-liquid-themes --agent claude-code

Installs into .claude/skills of the current project.

Files

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

Sponsors

Details

Repository
github.com/benjaminsehl/liquid-skills
Categories
Frontend Development, Documentation, Automation & Workflows

More from benjaminsehl/liquid-skills

All 3
1freshtechbro avatarblender-web-pipelinefreshtechbro/claudedesignskillsBlender to web export workflows for 3D models and animations. Use this skill when exporting Blender models to glTF for web, optimizing 3D assets for Three.js or3.9Kskills.sh installs
2majidmanzarpour avatarthreejs-gameplay-systemsmajidmanzarpour/threejs-game-skillsBuild and iterate playable Three.js game systems. Combines starter scaffold creation, architecture, game design, level design, gameplay implementation, combat/e3.8Kskills.sh installs
3mantinedev avatarmantine-comboboxmantinedev/skillsBuild custom dropdown/select/autocomplete/multiselect components using Mantine's Combobox primitives. Use this skill when: (1) creating a new custom select-like3.8Kskills.sh installs
4yaklang avatararbitrary-write-to-rceyaklang/hack-skillsArbitrary write to RCE playbook. Use when you have an arbitrary write primitive (from heap exploitation, format string, or OOB write) and need to convert it int3.8Kskills.sh installs
5dpearson2699 avataralarmkitdpearson2699/swift-ios-skillsImplement AlarmKit alarms and countdown timers for iOS and iPadOS with Lock Screen, Dynamic Island, StandBy, and paired Apple Watch system UI. Covers AlarmManag3.8Kskills.sh installs
6yaklang avatardangling-markup-injectionyaklang/hack-skillsDangling markup injection playbook. Use when HTML injection is possible but JavaScript execution is blocked (CSP, sanitizer strips event handlers, WAF blocks sc3.8Kskills.sh installs