Sections & Section groups
Build your own home page with a wide variety of sections.
Your home page is made up of reusable components called Sections. These are the blocks of content that sit on top of each other, from top to bottom as you scroll down your home page.
What Are Sections in Shopify?
Sections are modular, customizable blocks of content that make up the layout of your Shopify store pages. Think of them as “building blocks” you can mix, match, and move around to design your site—without needing to write any code.
They are a key part of Shopify’s Online Store 2.0 and allow merchants to easily create unique, flexible page layouts.
How are sections used?
1. Design Page Layouts
You use sections to build your homepage, product pages, collection pages, and even custom pages. Each section holds a specific type of content—like images, text, products, or videos.
2. Drag-and-Drop Editing
In Shopify’s Theme Editor, you can:
Add new sections to a page
Reorder them by dragging and dropping
Customize the content and design within each section (like changing images, headings, or colors)
3. Create Unique Pages
Thanks to Online Store 2.0, sections are no longer limited to just the homepage. You can now:
Use sections on every page
Build custom page templates using different combinations of sections
What are Section groups?
Section groups in Shopify are a newer, powerful feature introduced as part of Online Store 2.0 (OS 2.0). They allow you to manage multiple sections together as a unit, especially in fixed areas of your theme like the header, footer, and announcement bar.
A section group is a container that lets you group multiple theme sections together in specific areas of your store, such as:
Header
Footer
Instead of having one static "header.liquid" file, for example, you can now have a header section group that includes:
An announcement bar section
Each of these can be managed individually, reordered, or customized in the theme editor.
Why are Section groups used?
1. Modular Customization
Section groups give merchants more control over static areas of their site by letting them:
Add or remove blocks or full sections within those areas
Reorder elements in the header or footer
Swap out entire components (e.g. change how navigation is displayed)
2. No More Hardcoding
Before OS 2.0, parts like the header or footer were typically hardcoded. With section groups, Shopify made them modular, so you can manage them visually in the editor—no code required.
3. Cleaner Theme Code
Section groups help developers keep theme structure organized and scalable. Each section stays in its own file, and groups keep related sections together.
4. Improved Theme Flexibility
Themes can now offer more customization without becoming bloated or needing multiple layout options.
Last updated