Sections overview
Sections are the building blocks of every page, post, and template you create. This page explains what a section is, how families and variants fit together, and how they connect to your theme so you can build with confidence.
What a section is
A section is one self-contained band of content on your page — a hero, a card grid, a pricing table, a footer, and so on. You stack sections top to bottom to compose a page.
Each section holds its own content (its title, text, images, links, and lists) and its own layout choice. You edit a section in place: click it in the builder, change its fields in the side panel, and the preview updates as you type.
Families and variants
Two ideas sit at the heart of the builder: families and variants.
- A family is the kind of section — what it is for and what content it holds. "Card grid", "Pricing", "FAQ", "Testimonials", and "Footer" are all families. A family defines the fields you fill in, like a title, a summary, and a list of cards.
- A variant is one look for that family — a specific layout and style. A single family ships with several variants, for example a card grid with an "icon tiles" variant and a "spotlight" variant.
The important part: your content lives on the family, not the variant. When you switch a section to a different variant, you keep all your text, images, and links — only the layout and styling change. This lets you try different looks without re-entering anything.
How to add a section
- Open a page, post, or template in the builder.
- Click Add section in the toolbar to open the Insert Section dialog.
- Pick a family from the list. Each family shows a short description of what it does.
- Choose the variant you want to start from. A preview thumbnail shows each option.
- The section is added to your page, ready to edit.
How to change a section's variant
- Click the section you want to change.
- In the side panel, use the variant picker to choose a different layout.
- Your content stays in place; only the look updates.
How sections map to themes
Your website's theme (also called a kit) decides how each variant actually looks — the fonts, colors, spacing, and finish. A variant like "spotlight" is rendered differently by a minimal theme than by a bold theme, while the content stays the same.
This is why switching themes is safe: every variant has a matching render in each theme, so your pages keep their structure and content and simply pick up the new theme's styling. To learn more, see Builder overview and Templates.
Where sections can be used
Not every family fits everywhere. Each family is available in one or more contexts:
- Pages — general marketing and content pages.
- Blog posts — article-focused sections like article headers, author cards, and related articles.
- Products — commerce sections like product hero, spec table, and recommended products.
- Templates — shared shell pieces like navigation and footer that wrap your whole site.
When you open the Insert Section dialog, you only see the families that make sense for what you are editing. Some families are also limited to a single use (for example, a footer is added once), so they will not appear again after they are in place.
Next steps
- Builder overview — the editing workspace and how to navigate it.
- Templates — reusable shells that wrap pages, posts, and products.
- Publishing a website — take your composed pages live.