HTML to Liquid Converter

Schema

Select Schema Setting

Dropdown that drives layout or style variants in Liquid.

Convert to sectionFull cheat sheet

Copy or embed this snippet

{
  "type": "select",
  "id": "layout",
  "label": "Layout",
  "options": [
    { "value": "grid", "label": "Grid" },
    { "value": "carousel", "label": "Carousel" }
  ],
  "default": "grid"
}

Embed this snippet on your blog or docs — attribution link appreciated: HTML to Liquid Converter · Convert to Shopify section →

Related snippets

Basic Section Schema

The minimum required JSON to make a section editable.

Block Schema Definition

How to define blocks inside a section schema.

Text Setting in Schema

The most common setting type for headings and labels.

Generate Shopify Sections

Free browser-based converter — OS 2.0 compatible output with schema validation. No signup required.

Paste HTML & Generate LiquidView examples