When you turn static HTML into a Shopify section, you have two routes: let an AI model read your markup and generate the Liquid for you, or use a fast, rules-based engine that wraps your HTML and produces a basic, predictable schema. HTML2Liquid supports both, and neither is "better" in the abstract — the right choice depends on how complex your markup is, how polished the result needs to be, and how much you want to learn along the way.
This guide explains how each mode works, where each one shines, and a hybrid workflow that gets you the best of both.
How each method works
Manual conversion follows a fixed set of rules. It takes your raw HTML, wraps it in a section, and maps obvious elements to schema settings — headings and paragraphs become text/richtext settings, <img> becomes an image_picker, links become url settings, and so on. It runs instantly, with no API call, and the output is the same every time you run it on the same input.
AI conversion sends your HTML to a language model that analyses structure and intent before generating Liquid. Because it "understands" relationships between elements, it can detect repeating patterns and turn them into {% for %} loops, infer sensible default values, and build a richer {% schema %} with more appropriate input types. The trade-off is that it takes a little longer and, like any code generator, needs a quick review before you ship.
When to use manual conversion
Manual conversion is the right call when the HTML is simple and you want results immediately.
- Basic sections — plain text, an image, and a button don't need AI to map cleanly.
- Quick prototyping — when you're sketching a layout and just need editable Liquid fast.
- Learning Liquid — seeing the direct, rule-based mapping from HTML to schema is one of the clearest ways to understand how sections are built. If you're new, start with How to Convert HTML into a Shopify Section.
- Predictable output — when you want the same standardized result every time, with no surprises.
- Zero cost and no limits — manual conversion is unlimited and runs without an account.
Strengths: instant, predictable, free, lightweight, and easy to read and tweak afterwards.
Limitations: it produces functional but minimal code. It won't infer loops for repeating blocks or build advanced settings — you'll add those by hand.
When to use AI conversion
AI conversion earns its keep when the markup is complex or the result needs to be production-ready.
- Rich, nested layouts — the AI can interpret nested structure and the relationships between elements rather than mapping tags one by one.
- Custom landing pages — one-off layouts convert into flexible sections with meaningful settings.
- Repeating content — cards, logos, testimonials, and feature grids are detected and converted into blocks or loops automatically.
- Production work — when you want a fuller schema with validation-friendly defaults and a range of input types (ranges, toggles, color pickers) ready for merchants to edit.
Strengths: smarter schema generation, cleaner and more maintainable Liquid, automatic loops for repeating patterns, and sensible default values inferred from your content.
Limitations: it's not instant, and you should always review the output and test it in the theme editor before publishing. Cleaner, more semantic input HTML produces noticeably better results.
Code quality compared
| Manual | AI | |
|---|---|---|
| Speed | Instant | A few seconds |
| Schema depth | Basic settings | Fuller schema, more input types |
| Loops for repeating content | Manual | Detected automatically |
| Default values | Generic | Inferred from your content |
| Best for | Simple sections, learning | Complex, production sections |
| Cost | Free, unlimited | Plan-based daily limit |
A practical hybrid workflow
You don't have to pick one and stick with it. A workflow many developers settle into:
- Start manual for the simple, structural parts of a page (a hero, a single banner). It's instant and free.
- Switch to AI for the genuinely complex sections — anything with repeating blocks, multiple interactive elements, or a layout you want fully editable in the theme editor.
- Refine the schema afterwards using a reference. Whichever method you used, the Section Schema reference and the Liquid Cheatsheet help you tighten settings, add
visible_ifconditions, and clean up defaults.
Reproducible scenario: when AI may help
Consider a product showcase with repeated cards and several conditional states. AI can propose loops, conditionals, and a deeper schema, but pricing and filtering also depend on Shopify objects, forms, and theme JavaScript that static HTML does not describe. Use the proposal to identify a content model, then verify every resource reference and interaction manually.
Reproducible scenario: when deterministic conversion is clearer
For a simple hero banner—heading, supporting copy, and a call-to-action link—the structure is flat and the settings are obvious. Deterministic conversion produces the same mapping for the same input, which makes review and debugging straightforward.
The bottom line
Shopify's official sections documentation and Theme Check guide are the sources of truth for the platform rules used during review.
Both methods can be useful; the skill is matching the method to the task. Reach for manual conversion for predictable mappings, small sections, and learning. Consider AI when you want a second proposal for a complex content model—not because the result is automatically production-ready. In either case, the final authority is the schema parser, Theme Check, the theme editor, and a storefront test.
Ready to try it? Open the HTML to Liquid converter, paste a section, and compare the two outputs side by side. If you're new to sections, the step-by-step conversion guide is the best place to start.