Replies within 24h
Guide · Shopify sections
Sections are the native Shopify unit for merchant-editable page content. Understanding what a section actually is — and how it differs from a block or a snippet — makes the rest of theme development straightforward.
The three building blocks
A section is a modular chunk of a page — a hero, a product carousel, a testimonial grid. It lives in sections/, has its own Liquid markup, its own scoped CSS, and a {% schema %} block that defines what the merchant can edit from the Theme Editor. Sections can be added, removed, and reordered without touching code.
A block is a repeatable unit inside a section. A testimonial section might have a block type called "Review" — the merchant adds as many as they need, each with its own quote, author, and rating. Blocks are defined in the section's schema and rendered with afor block in section.blocks loop.
A snippet is a reusable Liquid partial — not editable from the admin, not directly tied to a schema. A product card, a star rating component, a formatted price — things used in multiple sections that shouldn't be copy-pasted. Included via {% render 'snippet-name' %}with explicit variable passing.
When custom beats stock
A split-screen hero with a video on one side and a product form on the other. A sticky editorial sidebar that scrolls with the page. A before/after image slider tied to a specific collection. If no theme ships it and a page builder's output is a mess of inline styles and nested divs — build a section.
A custom section's schema exposes exactly what the merchant should be able to change — the headline, the background color, the number of columns — and nothing else. A page builder exposes everything and makes it easy to accidentally break the layout.
Page builders generate DOM via JavaScript — the section HTML is built client-side after the page loads. A native Liquid section is server-rendered HTML from the first byte. For LCP and content-heavy sections, that's a measurable difference.
GemPages starts at $29/month. Shogun starts at $39/month. For sections that don't need real-time previewing or advanced drag-and-drop — which most storefronts don't — a set of custom Liquid sections with a solid schema does the same job for free.
Related