Browse documentation
Use the visual builder
Learn the canvas, select the right layer, and make precise changes to text, layout, and appearance.
Where to find it
- All projects
- Open a project
- Design
- Style
In this guide
A first edit you can verify on the canvas and revisit after reopening the page.
Before you start: Open a project with editing access. Wait for live editing to finish connecting before making changes.
Get to know the editor
The left rail opens Add, Navigator, Pages, Components, Assets, and CMS. The center is your canvas. The right side holds Style and Agent.
- 1Navigator. Select the right layer in the page structure.
- 2Style. Edit the selected layer’s appearance and content.
- 3Device controls. Inspect responsive breakpoints.
| Control | Use it for |
|---|---|
| Navigator | Find layers, expand nested content, and select an element that is hard to click. |
| Style | Edit the selected layer’s content, dimensions, spacing, typography, and effects. |
| Agent | Ask questions about the current page or request a specific change. |
| Design / Overview | Edit a page in Design; inspect pages together in Overview. |
| Preview | Play the website with its interactions and navigation. |
| Publish | Open the site’s publishing controls. |
Change a heading
Use the template homepage as a starting point. Selection matters: a section contains other layers, while a heading contains the copy you want to edit.
- 1
Select the actual text layer
Click the heading on the canvas. If a larger section is selected, expand that section in Navigator and choose its heading. Check the layer name at the top of Style.
You should see: A selection outline surrounds the heading and Style displays controls for that layer.
- 2
Edit the copy
Double-click the text to edit it inline. You can also use Style → Text → Content. Finish the edit by clicking outside the text.
- 3
Adjust its appearance
In Text, change Font, Weight, Color, or Size. Check the current breakpoint before making the change. Use Spacing for margin and padding.
- 4
Verify the saved result
Wait for any save or connection notice to settle. Open another page and return to confirm the new copy is retained. Use Undo in the canvas toolbar if the edit is not what you intended.
Adjust layout without fighting the canvas
Select the container when you want to change how its children are arranged. Select an individual child when you want to change only that item.
| Goal | Controls to inspect |
|---|---|
| Space between items | The parent’s Layout controls and gap. |
| Space inside a section | The section’s Spacing → Padding. |
| Space outside an element | The element’s Spacing → Margin. |
| Content is clipped or too wide | Size, Max Width, parent layout, and overflow. |
| A button goes to the wrong place | Select the button, then Link → Link To. |
Check before moving on
Before you move on
- The correct text changed; neighboring copy is untouched.
- The button’s Link To destination points to the intended page or URL.
- The layout works in Desktop, Tablet, and Mobile.
- The change remains after reopening the page.
Screenshots use a local sample workspace.