Section themes

To get started

To begin testing the new Section themes you will need to create a developer preview store and learn how to test upcoming features. The Section themes REST API will help you test out Section Themes.

Glossary of terms

Theme frame : A set of sections that appear at the top and bottom of pages. They are applied on multiple pages by a theme and are stored in the config/frames.json theme file. These are injected in content_for_layout and replace statically-included sections in theme layouts.

Master page: A set of sections to be applied on multiple pages. These are not stored inside themes and can be managed and customized through the UI.

Frame sections: Section files in the frame/ directory of themes. These can be used in theme frames, which power the top and bottom of the page in Sections enabled themes.

Page sections: Section files in the pages/ directory of themes. These power the new Sections enabled pages and replace theme templates.

Content sections: Section files in the content/ directory of themes and can be added to sections enabled pages through the UI. They can also be added to master pages.

Non-standard content sections: Content sections that don’t accept user content and may not work across all themes.

Legacy sections: Section files in the sections/ directory of themes. These are for use only by theme templates, including the legacy homepage, and theme layout files.

Legacy homepage: The content_for_index based homepage whose content is stored inside of themes.

Static sections: Legacy sections rendered via the {% section %} Liquid tag.

Paradigm shift

The sections feature introduces a new paradigm for how pages are rendered and customized.

Template paradigm

  • Pages render a template file in the templates directory of themes, which can optionally use static sections to bring customization options to the merchant in the Theme Editor. Static sections are tied to a particular theme, can't be added and removed in the store admin, and can't be edited per-page.

  • Additional content can be added through the rich-text content of the resource, which can be edited per-page in the store admin, but does not support sections.

  • Multiple theme templates can be created in the theme and assigned to sets of pages in the store admin.

  • The homepage is a special page whose entire content is stored inside of the theme's config/settings_data.json file.

New sections paradigm

  • Pages render their associated sections, one of which, the page section stored in the pages directory of themes, acts as the main section of the page. The section data is owned by the page resource, and therefore reused across themes, with the theme only acting as a “renderer”.

  • Additional sections can be added and removed per-page, or across multiple pages using the master page feature, in the store admin.

  • Master pages are store resources that enable pages of certain types to share sections. Page-specific “overrides” of master page configurations can be made in the store admin.

  • The homepage is a normal custom page that has been published as homepage.

Features of both paradigms

  • Both paradigms run pages through the theme layout file and output content in the content_for_layout Liquid variable.

  • Both paradigms support theme frames, which allow content appearing at the top and bottom of pages to be modeled with sections. The configuration of those sections continues to be tied to a particular theme.

Ready to start selling with Shopify?

Try it free