Sections

Sections are reusable, customizable areas of a page. They hold the markup, styles, and scripts for one part of a storefront, along with a JSON schema that lets sellers configure them from the theme editor.

Location

Sections live in the sections directory of the theme, one .liquid file per section.

└── theme
    ├── layout
    ├── sections
    │   ├── header.liquid
    │   ├── featured-products.liquid
    │   ├── footer.liquid
    │   ...
    ...

Content

Sections can contain three main types of content:

Type	Description	Required
Main content	Any HTML or Liquid content you want to render. Sections have the same access to global objects, tags, and filters as other Liquid theme files, plus the section-specific section and block objects.	No
Assets	JavaScript and CSS bundled with the section through the {% javascript %} and {% style %} tags. See JavaScript and styles.	No
Schema	A single {% schema %} tag defining the section's attributes and settings: label, tag, limit, settings, blocks, and max_blocks. See Section schema.	Yes

Content

When working with sections, you should familiarize yourself with How to render a section

Rendering sections

You can render sections in one of the following ways:

• Reference the section in a JSON template or layout file.
• Statically render the section with the section Liquid tag.

Statically render a section

You can statically render a section using the Liquid section tag.

{% section 'header' %}

To let sellers configure a section's child items from the theme editor, see Blocks.