Take a tour of the page builder
What every panel, button and tab in the builder actually does.
-
The canvas is the page
The large area in the middle is your page. What you see there is what visitors get, minus the small editing affordances.
-
Left panel: your toolbox
Elements (all available blocks), Sections (pre-built page segments), Layers & Files (the page tree), CSS Classes, Asset Manager, Templates, SEO & sharing, Site-wide settings, and Keyboard Shortcuts.
-
Right panel: styling
Select a block and the right panel shows its style controls - typography, spacing, colours, borders, background, and animation.
-
Top bar: view and history
Switch between Desktop, Tablet and Mobile previews, zoom in and out, toggle the alignment grid, and use Undo / Redo. Save and Publish live on the right.
-
Selecting things
Click a block to select it. Ctrl+click (Cmd on Mac) selects several at once. Double-click text to start editing it in place.
-
Nesting
Sections, containers, rows, columns and grids can hold other blocks. Drop a block onto one of those and it becomes a child instead of a new top-level block.
Good to know
- Press and hold Space, then drag to pan the canvas - useful when you are zoomed in.
- The Layers tab is the fastest way to reach a deeply nested block.
Related guides
Shortcuts you may need
| Ctrl + S | Save the page |
| Ctrl + Z | Undo |
| Ctrl + Shift + Z | Redo |
| Ctrl + C / V | Copy / paste selected blocks |
| Ctrl + D | Duplicate the selected block |
| Ctrl + A | Select all blocks |
| Ctrl + = / - | Zoom in / out |
| Ctrl + 0 | Reset zoom to 100% |
| Delete / Backspace | Delete the selected block |
| Space + drag | Pan the canvas |
| Ctrl + scroll | Zoom the canvas |
| Ctrl + click | Select several blocks |
Did this solve it?
If not, the community and our support team are one click away.