HTML to Liquid Converter

Product

Loop All Variants

Iterates every variant (size, color, etc.) on a product.

Convert to sectionFull cheat sheet

Copy or embed this snippet

{% for variant in product.variants %}
  <option value="{{ variant.id }}" {% unless variant.available %}disabled{% endunless %}>
    {{ variant.title }} — {{ variant.price | money }}
  </option>
{% endfor %}

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

Related snippets

Product Title

Outputs the title of the current product.

Product Price Formatting

Formats the product price according to the store's currency settings.

Product Vendor & Type

Outputs the vendor (brand) and product type.

Practice in the converter workspace

Draft OS 2.0 section output after you choose the right design pattern.

Open converter workspaceBrowse learning examples