/Custom sections and dev
Build a Shopify section with Claude Code, schema included
July 20, 2026 · WOCX
A custom Shopify section used to be a developer’s afternoon and it has become a conversation, provided the conversation is run right. Claude Code and its class of coding agents write Online Store 2.0 sections that install clean, schema, blocks, editor settings, the whole shape, and the difference between a section that ships and a mess that gets rebuilt by hand sits almost entirely in how the work gets specified. This piece is the specification method, the same one behind our page-cloning workflow, aimed at the single-section job.
Why single sections deserve their own method, the economics keep pointing there. The app-replacement math showed 23 of 27 audited stores paying subscriptions for features a sixty-line section covers, and the sixty lines are exactly the size of job an AI agent handles well, small enough to review completely, structured enough to specify precisely.
What the agent needs before any code
The failed version of this workflow starts with build me a testimonial section and gets something that looks right in isolation and wrong in the theme, foreign spacing, hardcoded colors, settings nobody asked for. The working version hands over context first, and the context is three things. The theme’s conventions, one existing section file pasted whole, because the agent infers the CSS variable names, the spacing units, the schema style from a single good example. The content model, what the merchant edits, how many blocks, which fields, stated as a list. And the constraints, no external scripts, no hardcoded text, settings for everything a non-developer touches.
Here is an existing section from my Shopify theme: [paste the
full .liquid file]. Build a new section matching its conventions
exactly, same CSS variable usage, same spacing system, same
schema style. The section: a testimonial strip. Merchant edits:
heading, 2-6 testimonial blocks, each with quote, name, detail
line. Constraints: no external scripts or fonts, no hardcoded
copy, every visible string editable in the theme editor,
mobile-first, works with the theme's existing typography.
The paste-a-real-section move does more than every adjective. Style descriptions produce generic code in the way style descriptions produce generic copy, the same lesson from the writing side, showing beats telling, and one authentic example carries a theme’s whole dialect.
The schema is where AI sections go wrong
The visible markup is the part AI reliably gets right, and the schema, the JSON block at the section’s foot that defines what the theme editor shows, is where the failures cluster. The recurring ones, worth checking on every generated section, a max_blocks missing so the editor allows forty testimonials, default values absent so the section installs empty and looks broken until someone types, presets omitted so the section never appears in the add-section menu at all, and settings typed wrong, a color field as text, a range where a select belongs.
| The schema check | What breaks without it |
|---|---|
presets present and named |
Section missing from the add-section menu |
default on every text setting |
Installs looking broken, merchant confused |
max_blocks set sanely |
Forty-testimonial accidents |
| Correct setting types | Color pickers as text fields, editor pain |
t: translation keys or plain labels |
Console warnings, messy editor labels |
The reviewing habit that catches all of it, install the section on a duplicate theme and click every setting in the editor before it goes near production. Five minutes, every failure above surfaces immediately, and the agent fixes each in one message when told specifically what misbehaved. The fix loop is the workflow, generated, installed, clicked through, corrected, and two rounds usually lands it.
What stays human, the judgment layer
The agent writes the section, and three decisions stay on the human side of the desk. Whether the section should exist, the app-versus-code call, a build the store does not need is fast to generate and still worthless. What the section says, the default copy and the content model come from the store’s selling logic, not from the code’s author, an agent asked to invent testimonial placeholder text will cheerfully invent testimonials, and defaults ship to production more often than anyone admits, the honesty line from our trust-signals position applies to placeholder text too. And performance review, the generated section gets the same weight scrutiny as any code, no surprise external requests, images through the theme’s own image pipeline, nothing render-blocking.
The wider point about coding agents, the pair-programming frame fits better than the replacement frame. The agent types faster than any developer and reviews worse than any decent one, so the human moves to the review seat, and the review seat needs to know what a schema failure looks like, which is what this piece is for.
The build worth doing this week
If a first AI-built section is the goal, the sticky add-to-cart bar from our build guide is the ideal candidate, small, high-return, and the spec is already written there. Paste the theme’s product template as the convention example, hand over the bar’s requirements, run the loop, and the store gets its highest-ROI section for the cost of an hour’s conversation and review. The second candidate is whichever display app from the replacement list charges the most monthly, rebuilt as a native section, the subscription canceled the week the section ships.
FAQ
Can Claude Code really build Shopify sections?
Yes, reliably, when given a real section from your theme as the convention example and a precise content model. The review loop does the rest.
What do AI-built sections get wrong?
The schema, mostly. Missing presets, absent defaults, unbounded blocks, mistyped settings. The theme-editor click-through surfaces every one in minutes.
Do I still need a developer?
For the review seat, someone who recognizes a schema failure and a weight problem. The typing is the agent’s job now, the judgment is not.
How long does an AI-built section take?
An hour of conversation and review for a display section, two correction rounds typical. Against a developer’s afternoon, or an app’s forever-subscription.
Which section should I build first?
The sticky add-to-cart bar, small and high-return, or whichever display app bills you most, rebuilt native and the subscription canceled.
Want a section built this way for your theme, spec to shipped, review included? Send me the store and I will scope the first one. Free look, no obligation, usually a reply within the hour.