Using the builder
The builder is where you edit your site. Drag sections in, click anything to change it, publish when you are happy.
The layout
| Where | What is there |
|---|---|
| Left sidebar | Sections - ready-made blocks to drag in. Elements - single pieces like a button or image. Layers - the page as a tree, for selecting things buried inside others. Design - site-wide colours and fonts. Add-ons - integrations. |
| Middle | The canvas: your page, as it will look. |
| Right sidebar | Properties for whatever is selected, Page for this page's own settings, and AI Assistant. |
| Top bar | Viewport switches, Page Settings, Scan, Site Structure, Snapshots and Publish. |
Editing
Click something to select it. The right sidebar switches to its Properties - text, colours, spacing, links, whatever that piece has. Text can also be typed directly on the canvas.
Each selected component has a small toolbar: Move Up, Move Down, Duplicate, Delete, and Copy Style / Paste Style for carrying a look from one component to another.
Check the small screens
Desktop, Tablet and Mobile at the top switch the canvas width, so you can preview how the page looks on a phone or tablet without leaving the builder. Most visitors are on a phone, so check Mobile before publishing - a heading that fits one line on desktop often becomes four on a phone.
Site-wide design
The Design tab is where you set things once for the whole site:
- Global Brand Colors - Primary, Secondary, Success, Warning, Danger, Info.
- Global Typography - Heading Font, Body Font, Body Size, Line Height.
- Global CSS and Global JS for custom code.
Change the primary colour here and every button, link and accent that uses it changes with it. That is much safer than recolouring components one at a time.
Saving and publishing
Your work saves as you go. Saving is not publishing - the live site does not change until you press Publish. See Publish your site.
Snapshots keeps restore points, so you can experiment and roll back.
Good to know
- Content can only go inside the page body. Drop something onto the header or footer and it will refuse - those are global, and shared by every page. See Header, footer & global blocks.
- Use Layers when clicking will not select the right thing. Nested components are easier to pick from the tree than on the canvas.