How to Add Sections Everywhere on Shopify 1.0 Themes

Want Sections Everywhere but have already built your shop on Store 1.0? Read on for ste-by-step instructions on how to add this new feature to an older theme.

How to Add Sections everywhere on Shopify 1.0 themes

On Shopify, it has traditionally been easy to make a great looking homepage with the theme's section building blocks, but difficult to edit other pages to look equally exciting. That’s why page builders like PageFly exist - to help designers do that. But those apps have a monthly cost and can potentially slow the loading speed of your website, so a coded solution is always preferred in my opinion.

It’s actually very easy to add theme sections to other pages on any theme.

What is Shopify 1.0 vs Shopify OS 2.0?

Shopify recently (mid-2021) released Online Store 2.0 which has many upgrades in the Customizer, and 2.0 themes have the long-anticipated “Sections Everywhere” feature that makes putting sections on any page a complete breeze. This article is for anyone that is using Store 1.0 (technically called a Vintage theme) and needs to create page templates that include several sections. It isn’t as easy as one-click to upgrade a theme to 2.0 so many stores are still on the 1.0 version that they originally purchased. If you want to learn more about the difference between 1.0 and 2.0 themes, read our article, What is Shopify OS 2.0?.

Let’s add Sections Everywhere to your store.

How to Add Sections Everywhere Tutorial

Go to your theme code files. Go to Online Store —> Actions —> Edit Code.

1. Go to the Templates folder and look for the page.liquid file. Copy all the content to your clipboard.

2. Go to the Sections folder. Add a new section called page-main. Make some space above the default code, and paste the content copied in step 1. In the schema, change "Section name" to "page-main", change "settings" to "tag" and change "[ ]" to "section" (careful not to add a comma after this). Click Save.

Shopify tutorial code screenshot

3. Return to the Templates folder. Click Add a new template. Choose a page template, JSON type, and name the template the same as your page name. I'll name mine "about". My file is called "page.about.json". Delete all the code in this file and replace it with the code below. Notice how "type": "page-main" matches the name of the file we just created in Step 2. Click save.

4. Connect your page to the new template. Go to your pages under Online Store --> Pages. Click on your page, and change the page template on the bottom right. The dropdown should show the name of the page template you just created.

Shopify page template selection screenshot

The list will only show templates existing on the live theme. If you’re working on an unpublished theme, you’ll need to create a page template in the live theme with the same name, but in this theme, you will leave the default page template code and not add your sections (because you don’t want to affect the live theme).

5. Open the theme customizer and use the top dropdown to navigate to your page template. Now you’ll see the option to add a new section, just like you do on the homepage! You're ready to make a beautiful new page.

Shopify tutorial theme editor screenshot

Remove the Page Title

If you don't want the page title or any of the page content that you've added in the "Pages" section of your store to appear at the top of the page, return to Sections --> page-main.liquid and remove the code that was previously pasted before the schema. This will remove the Heading 1 page title and page content.

Create Another Page Template

If you wish to create another page, you'll need to make a new page template for that page. Why's that? If you return to your page template file after adding some sections to your page, you'll notice that all the code has been replaced. The data from the sections you've added is now being stored here (as shown below).

To create another unique page template, scroll up to step 3 and repeat the steps to create a new page template with a different name.

Shopify tutorial code screenshot

Theme Updates & Conclusion

It’s great that Shopify 2.0 has finally solved the Sections Everywhere issue after years of talking about it, but I know many of us still need this trick when working on non-2.0 themes.

We do recommend that everyone upgrades their theme version to 2.0 as this will allow you to make use of Shopify's newest features, and experience improvements in speed, accessibility and performance.

If you found this helpful, you might like to check out our Shopify Store Launch Kit.

Shopify Sections FAQ

What are sections on Shopify?

Shopify’s sections are building blocks that make up a web page. Each section is its own template with customizable content and design. Sections can be easily added, deleted, reordered, or hidden to allow for flexible web page designs. Section examples include a slideshow section, multi-column section, newsletter signup section, and more. Every theme includes standard sections that have unique customizable options, as well as additional premium sections unique to the theme.

What is Sections Everywhere on Shopify?

Sections Everywhere allows you to add section templates to any page to create beautifully designed page templates right in the theme customizer. Prior to the release of Shopify OS 2.0, Shopify only allowed you to easily add sections to the homepage, resulting in plain other pages. As the platform grew, it restructured themes to allow better design and customization features for merchants. All themes currently sold in the Shopify Theme Store are OS 2.0 compatible and have the Sections Everywhere feature.

What is the section limit on Shopify?

Shopify has a 25 section limit per page. However, there is no limit to the number of section templates a theme can hold, allowing for ultimate flexibility in store designs.

Try Shopify for just $1 today.

Enjoyed this post?

Watch our
Free Training

Watch now
Free Shopify Training for Designers