Touring the builder

The builder sits below the same organization, website, and section navigation used by the rest of the website dashboard. Select Website builder between Overview and Domain to return to it. Inside that area is a narrow rail of icons on the left, a panel next to it, and your website filling the rest.

The panel rail

The icons down the left edge open the panels you work in. Selecting the icon of an open panel closes it again, which gives your preview the full window.

• Assistant — the conversation where you describe what you want built.
• Pages — every page of your website, homepage first. Select one to preview it, or use New page to add one. The new page opens immediately in the preview at its website address, ready to edit. The gear on a row opens the page's settings — its address and search details — and in Edit mode the current page unfolds into the sections it is made of. The arrow on a row opens that page at your website's own address, so the link is one you can copy or send to somebody else.
• Media — every image your website actually ships, so what you see here is what a visitor downloads. Photos and logos arrive here by being attached in the assistant, which optimises them into the site for you. See Images and the media library.
• Content — your website's data collections (services, reviews, posts…) at full size, with an editor for every entry. See Site data and collections.
• Versions — what your website has looked like over time, newest first, and the way back to any of it. See Version history.

The menu button (three lines) at the top of the rail opens the builder menu. It holds Back to dashboard, New page…, and submenus for View, Tools (with Improve Design, Remote File Search, and an SEO submenu holding the Broken Link Checker and the SEO Fixer), Website, and Advanced — plus links to open your preview or live website in a new tab.

Your account, your organization's billing, and the light or dark theme are on your avatar in the header above the builder — the same place they are everywhere else on the dashboard — so the builder itself doesn't repeat them.

Under Website you'll find the settings that live outside the conversation: Branding (your logo and colors), Assistant settings, Members, and Domain & publishing. The rest of them — company details, analytics, redirects, the cookie banner — are on your website's own page on the dashboard; see Managing your website.

The preview

The preview is your real website, not a picture of it. Links work; you can click through it exactly as a visitor would.

The switch at the top-left chooses how you look at it: Preview is the website as a visitor sees it, and Edit outlines every section so you can click one and change its text, images, and options right there — see Editing your pages. A third segment, Code, appears with developer mode.

If the last build hit a problem — a template that would not compile, a link to a page that does not exist, a font that never loads — a small dark pill in the bottom-right corner of the preview says how many problems there were. Click it to open the list, every problem in full and scrollable, with three things to do about them: Ask Max to fix it hands the whole list to the assistant, Dismiss puts the pill away until something new comes up, and Hide and never show again keeps build problems off this website's preview for good. To see them again after that, open Quick open (⌘K) and choose Show build problems again.

Along the top of the preview:

• Back, Forward and Refresh sit beside the mode switch, the way a browser keeps them. Back and Forward walk the pages the preview has shown since you opened the builder — a page picked from the menu or the Pages panel, a link you followed in Preview — and are greyed out when there is nowhere to go. Refresh loads the page again. In Edit mode, a change saved outside the page — the section's own code in the inspector, a row in the Content place — does not reload the page under you: the section you selected and your place on the page are kept, and an orange dot on Refresh says a newer version of the page is waiting. Press it when you are ready, or switch to Preview, which always shows the latest. In Preview mode the page reloads by itself after every change.
• The page name opens a menu to switch pages or add a page. Start typing to find a page by its address or name. The pages you wrote are listed first; pages your website generates from a collection — every blog post, every team member — sit folded under one row per collection with a count, so a hundred posts never bury your About page. Open the row to see them, or search: a search looks through the generated pages too. A long list scrolls inside the menu.
• The size switch shows the desktop, tablet, phone and fit widths side by side, with the one on the canvas highlighted — click any of them to check how a page reads on that screen. Tablet and phone are real widths (768 and 390 pixels), and desktop is at least 1280: the page lays out at that width whatever room the canvas has — wider when the canvas is wider — and is shown scaled down to fit when the side panel or the inspector leave less than that, a small percentage beside the switch saying by how much, so the desktop layout stays the desktop layout. Fit fills the canvas with whatever width there is, however narrow. Keys 1, 2, 3 and 4 jump straight to a size.
• Full screen hands the whole window to the workspace: the dashboard navigation and header step out of the way until you press the button again. The key F does the same, and the choice is remembered in your browser. These single keys only answer when you are not typing: in the code editor, the chat, or any field, an f or a digit is just the character you typed.
• The arrow opens the current page in a new browser tab.

Press ⌘B (Ctrl+B on Windows) to hide the side panel, and ⌘K to open Quick open, which searches your files and the builder's commands from one box.

When something else is working on your website

Only one change reaches your website at a time, so that two of them can never overwrite each other halfway. While anything is changing it — Max, a save in the code editor, a publish, a bundle import, a restored version, another member of your team, or the platform itself — a slim amber bar appears across the top of the builder, under the page name, in Preview, Edit and Code alike. It shows:

• who started it — a person's name and picture, or the platform;
• what it is — for example Publishing, Importing a bundle, or Saving intro-strip.blade.php;
• how long it has run, counting up, so work that is stuck is easy to spot.

When Max is at work, the bar leads with the person who asked: Tony is working on the website with Max. It names them the same way for everyone — Tony sees their own name there too, not "you" — so anyone opening the website can tell at a glance whose request is underway before making a change of their own. Only a request whose asker is not known reads Max is updating the website, with Max's own mark in place of a picture.

The bar goes away by itself when the work ends. It shows work started in another tab or by another member too, not only your own. The one exception is a save you made yourself from a panel — Edit mode, the code editor, Content, media, a form or branding: the panel you saved from already shows its progress, so the bar stays out of the way. Your own longer work, such as publishing, importing a bundle or restoring a version, still shows.

Stop ends the work. Owners, admins and members who can edit the website can stop anyone's work, not only their own; members with view-only access see the bar without the button. Stopping Max works exactly like the stop button in the assistant: Max stops, and the changes from that request are undone. Stopping anything else — a save, a publish, an import — ends it where it is, and anything it had already written stays in your draft; revision history can put a file back.

"Not saved yet — the website is busy"

If you save in the code editor while something else is changing the website, the builder tries again on its own for a few seconds. If the other work is still going, you'll see Not saved yet — the website is busy, with what is holding the website and who started it, and a Retry button. Nothing was lost: your edit is still in the editor. Press Retry once the bar has gone, or press Stop on the bar if the other work should not be running. The status at the top of the builder reads Not saved — website busy until the save goes through; hover it to see the reason.

"Save timed out"

A save that takes longer than the connection allows ends with Save timed out. The browser stopped waiting, but the save almost always carries on and finishes on its own — so for a little while the work-in-progress bar shows it as Saving your file, started by you. Your edit is still in the editor. Wait for the bar to clear, then press Retry.

Publishing

The publish button sits at the top right, and its label tells you where you stand:

• Publish — this website has never gone live.
• Publish changes — you have edits your live site hasn't received yet.
• Published — your live site matches what you're looking at.

Publishing puts the current version on your own domain, so you'll be asked to connect a domain first if you haven't. Your dev site shows your latest changes either way — you don't need to publish to see your work or to share a link with someone.

Developer mode

If you write code, turn on Developer mode under Advanced in the builder menu. It adds a Code segment to the mode switch, a code editor, and menu entries for creating files and folders. Everyone else can leave it off — nothing in the everyday builder requires it.