Liquid Theme Development (Online Store 2.0)

Liquid is Shopify's templating language for building themes and sections on Online Store 2.0. This skill covers Liquid syntax, section schema definition, JSON templates, blocks, filters (20+ common), objects, theme file structure, presets, and real-world section and template patterns.

When Asked

When asked to build a Liquid section with settings: Provide a complete section file with schema (settings array, presets, locales), CSS, and JavaScript; explain how settings map to template variables.

Before returning any section, app block, or theme schema: Run the Shopify schema dedupe check mentally or with scripts/validate-shopify-schema-ids.mjs <theme-or-file>. Every settings[].id must be unique within its own schema scope, every block's settings[].id must be unique inside that block type, and every blocks[].type should be unique unless you are intentionally defining different block entries. Do not paste settings from multiple examples until you merge and dedupe IDs.

When asked to implement product filters or sorting: Use the collection product pagination, filters by attribute, sorting with Liquid forloop and if/case statements; explain faceting.

When asked to add custom fields to products: Use metafields in Liquid (product.metafields.namespace.key), explain metafield definitions, and show rendering in sections.