Designing Liquid sections merchandisers love to use

Online Store 2.0 gave merchandisers a drag-and-drop page builder, and most themes responded by exposing every possible setting. The result is a theme editor with 60 controls per section, pages that drift further from the brand every month, and a merchandising team that quietly goes back to asking developers for changes. Good section design is the opposite: a small set of well-named choices that make the right outcome easy and the wrong one impossible. These are the rules we follow when we build sections for clients.

Start from the jobs, not the components

Before writing any Liquid, we sit with the people who will use the editor and list the jobs they do every week. For a typical DTC brand that list looks something like this: launch a new collection, run a promotion, feature press, answer objections on a product page, and swap seasonal imagery. Each job becomes a candidate section. Components that do not map to a job usually do not need to exist.

This framing matters because it changes the names. A section called Image with text tells a merchandiser nothing. A section called Promotion banner with settings for the offer, the end date and the target collection tells them exactly when to reach for it.

Every setting you expose is a decision you are asking someone to make under deadline. Expose only the ones they are qualified and motivated to make.

Our schema rules

We keep a short written standard for section schemas, and every section is reviewed against it before release.

1. No raw color pickers. Colors come from a color_scheme setting tied to the theme's defined schemes, so every section stays on-palette and meets contrast requirements.
2. No free font sizes. Typography is a select with two or three named options such as Standard and Large, mapped to the design system's scale.
3. Spacing is a choice of three. Compact, regular and spacious, rather than a pixel slider that invites 37px on one section and 41px on the next.
4. Every image setting has a stated ratio. The info text tells the merchandiser the ideal size, and the section crops predictably if they ignore it.
5. Blocks have limits. A testimonial carousel with "max_blocks": 6 is a design decision. Unlimited blocks is an abdication.
6. Presets are the documentation. Each section ships with at least one preset filled with realistic content, so adding it to a page produces something close to finished.
7. Settings are grouped and ordered by frequency. Content first, layout second, rarely used options last under a header.

A trimmed example of what a disciplined schema looks like:

{% schema %}
{
  "name": "Promotion banner",
  "max_blocks": 3,
  "settings": [
    { "type": "text", "id": "offer", "label": "Offer headline" },
    { "type": "collection", "id": "target", "label": "Links to collection" },
    { "type": "color_scheme", "id": "scheme", "label": "Color scheme", "default": "scheme-2" },
    { "type": "select", "id": "spacing", "label": "Spacing",
      "options": [
        { "value": "compact", "label": "Compact" },
        { "value": "regular", "label": "Regular" }
      ],
      "default": "regular" }
  ],
  "presets": [{ "name": "Promotion banner" }]
}
{% endschema %}

Flexibility where it earns revenue

Restricting style does not mean restricting merchandising. The flexibility we do build in is the kind that moves conversion rates.

• Content ordering on product pages through app blocks and theme blocks, so the team can test whether reviews or shipping details should sit above the fold.
• Dynamic sources connected to metafields, so a single product template can show size guides, ingredients or care instructions without a template per product type.
• Scheduling hooks such as start and end dates on promotional sections, which remove the Friday-night task of manually taking a banner down.
• Visibility toggles by market or customer tag where the brand sells internationally or runs a wholesale tier.

On one apparel store we reduced the section library from 41 to 17 sections. Page production time for a campaign landing page dropped from roughly two days of back-and-forth to about three hours, and the brand team stopped filing tickets for spacing fixes altogether.

Performance is part of the contract

Merchandisers should not be able to break the store's speed by adding a section. We enforce that in the code rather than in a training document. Images use image_url with explicit widths and a srcset, the first section on a template gets eager loading while everything below it loads lazily, and any section that needs JavaScript loads it as a deferred module only when the section is present on the page. Sliders and video embeds are the usual offenders, so we give them a static poster and load the interactive part on interaction.

We also test the worst case: a page with every section added twice. If that page still scores reasonably on mobile, the theme will survive a busy peak season of edits. This is the same discipline we apply in Liquid section builds for existing themes and in full custom Shopify themes.

Measure how sections are actually used

Three months after launch, we export the theme's JSON templates and count which sections and settings appear on live pages. The findings are consistently humbling. Usually a third of the sections are never used, and a few settings are set to the same non-default value everywhere, which means the default was wrong. Both are easy fixes, and removing unused options makes the editor faster to learn for the next hire.

We pair that audit with conversion data by template. When a section consistently appears on high-performing landing pages, we promote it into the default preset. When one correlates with high bounce rates, we look at why. That feedback loop is where section design meets conversion rate optimization, and it is the difference between a theme that ages well and one that is rebuilt in two years.

Want a theme your team will actually use?

If your merchandisers are fighting the theme editor, we can audit your current sections or design a new library around your team's real workflows. Tell us about your store and we will send a fixed-price quote within 24 hours.