"i only speak liquid" #95: "No more than 7 visible section settings"

Written by Brandon (a Storetasker Expert)

Author

Brandon Landgraff
March 26, 2026

Hey everyone,

Brandon is a talented developer based in Canada. His specialty is in geeking out on the many customisations available via Shopify. When he’s not deep in code, Brandon’s usually solving bouldering problems.

He’s an expert on Storetasker 😉 (apply here) and you can stay in touch with him here.

Let’s dive in 🤿

What I’ve been thinking about:

At this point, I’ve built hundreds of sections. What I’ve learnt is that settings can’t be an afterthought. Some of the sections I’ve built have been incredibly powerful, but if no one understands the section settings, they aren’t usable.

My rule: no more than 7 visible settings

The root cause for a section being unusable is if there are too many settings. Each setting is a decision point, and it’s important to keep the number of decisions a user needs to make down.

This is the constraint I now build around: No more than 7 visible settings per section or block. Not because 7 is magic… but because it forces discipline.

When I hit that limit, it’s usually a signal that:

  • The section is trying to do too much

  • A block should exist instead of a toggle

  • A layout variation should be compositional, not configurable

A common workaround to my 7 rule

You may be saying at this point “well Brandon… sometimes I need more than 7 settings and I can’t just keep nesting blocks”

And to that I say “you are right”

What I do in those scenarios is use conditional settings. For example, you can hide/show settings based on another setting's condition.

Below is an example of how I use conditional settings for background colors:

    {
 "type": "select",
 "id": "background",
 "label": "Background",
 "options": [
          {
 "value": "bg_color",
 "label": "Color"
          },
          {
 "value": "bg_image",
 "label": "Image"
          }
        ],
 "default": "bg_color"
      },
      {
 "type": "color",
 "id": "bg_color",
 "label": "Background color",
 "visible_if": ""
      },
      {
 "type": "image_picker",
 "id": "bg_image",
 "label": "Background image",
 "visible_if": ""
      },

We, as theme developers, put a lot of time and effort into building our sections, but we need to start thinking more about the maintainability and UX issues in the theme editor.

Flexi: An app I’ve been building for almost two years that lets me drop professionally built sections into any client project. I got tired of rebuilding the same sections over and over, so I turned my workflow into a system I can reuse across sites.

Tools I use to develop custom sections:

One learning as a freelancer:

Take a few minutes to research existing solutions before building. As developers, it’s easy to say “we can build that.” And often that’s true! But starting with a shortcut someone else has already built can save you hours.