Section

Sections allow you to add content to your page templates. A section is an instance of a section template with populated content.

To add a section to a page:

1. Go to Content -> Pages and click Edit content on the page.
2. In the editor sidebar, select a section template from the Section Templates dropdown.
3. Click Add to Page. The section is added to the end of the page.

To add a section in a particular place rather than at the end, use the ⋮ menu on any section in the list:

• Duplicate section — makes a copy of it, with all of its content and nested sections, directly below it
• Add section above — pick a template and the new section goes in immediately before this one
• Add section below — the same, immediately after

Whenever you add a section this way, its content fields open straight away so you can fill it in.

You can also do all of this on the page itself. See the live editor.

You can rearrange sections by dragging them in the order you want.

A page can have any number of sections and each section can have nested sections (nested components). For performance reasons, we suggest nesting sections up to a maximum depth of 5. The Page API also sends nested sections up to 5 levels deep.

To add content to a section:

1. Click the pen icon on the section, in the sidebar list or on the page itself.
2. Enter values for the section template props. Props like text, headings, images etc.
3. Click Save section content.
4. Click Publish Page when ready to go live.

Important: You must save before publishing changes.

While you type, your website in the preview updates to match. An Unsaved marker appears next to the save button until you save, and leaving the section discards anything unsaved.

To delete a section, click the bin icon on it and type delete to confirm. If you were editing that section, the editor takes you back to its parent, or to the page.

To nest a section within another:

1. Edit the parent section.
2. Select a child section template and click Add to Page.
3. Rearrange and populate child section as needed.

Nested sections behave the same as top level ones: each has its own row, its own ⋮ menu, and its own toolbar on the page.

Nested sections will be available in the page.sections.children array in the Page API response.

Reuse sections to avoid repeating yourself

Instead of recreating the same sections like footers, menus, etc. on every page, you can import these repeating sections to save time.

Follow these steps:

• First, create the reusable section on any page, such as the footer.
• Add that section to a new page.
• Click the pen icon for that section.
• At the bottom, click "Import content from other page" to grab the content.

This allows you to reuse sections without having to rebuild them from scratch each time. The imported section do not remain linked to the original, so if you update the original, the changes won't be propagated.

Sections can have different content across pages. For example, a "Hero" section may have unique heading, text, etc. on each page.