Guide: Understanding & Using Shopify Sections
What Are Sections?
Sections are modular building blocks inside Shopify themes. Think of them as “containers” that hold content like text, images, videos, or product grids. Each section can be customized directly in the Shopify Theme Editor without writing any code.
Why Sections Matter
- Drag-and-Drop Flexibility: Add or move sections anywhere on a page.
- No Coding Required: Update colors, text, and layout visually.
- Reusable: Install once, then use on multiple pages.
- Lightweight: Unlike apps, sections don’t slow down your site.
How to Use Sections in Shopify
Here’s a step-by-step guide for beginners:
1. Access the Theme Editor
- Log in to your Shopify admin.
- Go to Online Store > Themes.
- Click Customize on your active theme.
2. Add a Section
- In the left sidebar of the Theme Editor, click Add section.
- Choose the section you want to add (e.g., Hero banner, Product grid, Custom section).
- The section will appear in your page preview.
3. Customize the Section
- Click on the section in the left sidebar.
- Use the options to edit text, upload images, set colors, or adjust layout.
- You’ll see changes update in real time in the preview.
4. Rearrange Sections
- Drag a section up or down in the sidebar to move its placement on the page.
5. Remove a Section
- Click the section in the sidebar, then hit Remove section at the bottom.
Installing Custom Sections (Like Section Suite)
If you’ve purchased a downloadable .liquid section file:
- In Shopify admin, go to Online Store > Themes > Edit code.
- Under Sections, click Add a new section and paste in the provided code.
- Save the file.
- Return to the Theme Editor, click Add section, and you’ll find your new section ready to use.