The builder
The visual builder is where you lay out your content by stacking and configuring sections. This page explains the parts of the builder screen and the everyday flow: add a section, set it up, then save and preview.
Where the builder is used
The same builder powers pages, blog posts, and templates. You open it from a website's workspace:
- Pages —
/dashboard/websites/{website}/pages, then open or create a page. - Posts —
/dashboard/websites/{website}/posts, then open or create a post. - Templates —
/dashboard/websites/{website}/templates, then open or create a template.
Because they share one builder, the skills you learn here carry across all three. Forms have their own dedicated builder and work a little differently.
The screen
The builder has four areas:
- Toolbar (top) — page title, status, preview, revisions, and the publish button.
- Sidebar (left) — the section library you add from.
- Canvas (center) — a live preview of your content where sections stack top to bottom.
- Settings panel (right) — the settings for whatever you have selected.
Adding sections
Sections live in the left sidebar, grouped into categories. Use the Search sections... box at the top to filter the list.
- Hover or click a section family in the sidebar. A flyout opens showing the available variants, each with a live thumbnail.
- Add the variant you want in one of two ways:
- Click a variant to drop it at the bottom of the canvas, or
- Drag the variant onto the canvas and release it where you want it. A glowing amber line shows where it will land.
The new section is selected automatically so you can configure it right away.
Reordering and managing sections
Hover over any section on the canvas to reveal its controls:
- Drag handle — drag the section up or down to reorder it.
- Duplicate — make a copy directly below.
- Delete — remove the section.
You can also select a section and press Delete or Backspace to remove it, or Escape to deselect. In templates, the content-area section is locked and shows a lock icon — it cannot be deleted, duplicated, or moved out.
Configuring a section
Click a section to open its settings in the right panel. Each section's settings are split into clear groups:
- Variant picker — switch between visual styles for the same section. Your content is kept when you switch.
- Base — shared content that survives variant changes, like a heading or image.
- Variant — fields used only by the variant you currently have selected.
Some fields are linked to the item itself (for example, a heading bound to the page title). When a field is linked, editing it updates the underlying item; you can unlink it to set a section-only value, then relink later. Fields that are read-only show as disabled.
When nothing is selected, the panel shows the item's own settings instead — Page Settings, Post Settings, or Template Settings — including title, slug, excerpt, SEO fields, and the template to use.
Previewing your layout
Use the controls at the bottom of the canvas to check your design:
- Desktop / Tablet / Phone — switch the preview width to see responsive behavior.
- Dark mode toggle — preview how the page looks in dark mode.
For a full preview in a new tab, use Preview in the toolbar. The label changes to Preview draft when you have unpublished changes, or View live when the page is published and unchanged. A draft preview never affects the live site.
Saving and publishing
The builder saves automatically. A moment after you stop editing, the toolbar shows Saving... and then clears. While there are unsaved edits it shows Unsaved changes; if a save fails it retries on its own.
Auto-save keeps a draft — it does not change your live site. To make changes public, use the publish button in the toolbar:
- Publish — publish a page for the first time.
- Publish changes — push your saved draft to the live site.
- Unpublish — take a published page offline (under the more-actions menu).
A green Live badge appears when the live site is serving a published version. For history and rollbacks, open Revisions in the toolbar. See Publishing a website for the full publishing flow.