How to Add a Section to a Page in Shopify

Once a section exists in your theme, adding it to a page is a theme-editor task — no code required. This guide covers the full loop: choosing the right template, inserting the section, ordering and configuring it, and reusing the same section across multiple pages. It assumes an Online Store 2.0 theme (Dawn or any theme published after mid-2021), where sections can be added on almost every template.

If you have not built the section yet, start with How to create a custom section in Shopify and come back here to place it.

Templates vs. pages — the thing to get right first

In Online Store 2.0, you do not add a section to "a page" so much as to a template. A template (templates/index.json, templates/product.json, templates/page.about.json, and so on) is the file that lists which sections render and in what order. Every page that uses that template shows the same sections.

That distinction matters:

• Add a section to the product template and it appears on every product.
• Add it to a specific template — say page.about — and it appears only on pages assigned to that template.

So before you insert anything, decide whether the section belongs on one page or a whole class of pages, and pick the template accordingly.

Step 1 — Open the template in the theme editor

Go to Online Store → Themes → Customize. The editor opens on the homepage. Use the page dropdown in the top bar to switch to the page you want to edit — a product, a collection, or a specific page. The editor loads that page's template, and the left sidebar shows the sections already on it.

Working on a live theme is fine for small edits, but for anything you might want to undo cleanly, duplicate the theme first: Themes → ⋯ → Duplicate, then customize the copy and publish when you are happy.

Step 2 — Add the section

In the left sidebar, click Add section. A menu opens listing every section the current template allows — the theme's built-in sections and any custom sections you created that have a presets entry in their schema. Pick yours, and it drops into the page.

If your section does not appear in the list, it is almost always one of two things:

• The section's {% schema %} has no presets block, so Shopify will not offer it in the "Add section" menu. Sections without presets can still be referenced directly in a template's JSON, but they cannot be inserted from the editor.
• The section is restricted by a templates or enabled_on key in its schema to template types other than the one you are editing.

Step 3 — Position and configure it

Drag the section up or down in the sidebar to set its order on the page. Click it to open its settings on the right, and fill in the fields the schema defines — headings, images, links, colors, and so on. Changes preview live in the middle of the screen.

You can also hide a section without deleting it: click the eye icon next to it. This is handy for seasonal blocks — a sale banner you toggle on and off — without losing its settings.

When you are done, click Save.

Step 4 — Reuse the section on other pages

Because a custom section with a preset lives in your theme, it is available on every template that allows it. To reuse it, open another template from the page dropdown and repeat Add section. Each placement is independent: the same section type can hold different heading text on the About page and the Contact page, because settings are stored per placement in that template's JSON, not on the section file itself.

Two common targets have their own step-by-step guides:

• How to add a custom section to the homepage
• How to add a section to the product page

Adding a section to a single, specific page

If you want a section on one page and not every page of that type, create a dedicated template for it. In the code editor (Themes → ⋯ → Edit code), duplicate templates/page.json as templates/page.about.json. Then, in the admin under Online Store → Pages, open the page, and in the Theme template dropdown on the right, assign it your new about template. Now any section you add to that template shows only on that page.

Where these placements can break

Everything above stores your work in the theme's template JSON. That is the normal way sections are placed — but be clear about the trade-off. When you install a new version of the theme or switch themes, Shopify publishes a fresh copy of the theme files. A custom section file that is not carried over cannot be referenced, so placements pointing at it are lost, along with the settings a merchant configured.

There are two honest ways to keep the work:

1. Track your custom section files and re-apply them after each theme update. The method is in Update your theme without losing customizations.
2. Render the section from an app via a Theme App Extension, so app blocks appear in the same "Add section" menu but survive theme updates and swaps.

If these sections are ones you rely on long-term, SectionGuard renders them from the app rather than your theme files — so the same in-editor placement and configuration survive every theme update.