Edit a website in the workbench
Change text and styles by clicking, ask for bigger changes in the chat, add ready-made sections and undo a change.
The written steps below are complete. The Video script tab shows exactly what the video will cover.
The workbench gives you several ways to change a site, from the smallest to the largest. Use the smallest tool that does the job: it is faster and more predictable.
By the end you can
- Edit one element by clicking it
- Ask for a page-wide change in the chat
- Insert a section from the library
- Undo the last AI change
Screens used
- Project, Web Design, one site
Steps
- 1
Open the site
On: Project, Web DesignOpen Web Design in the project and open the site.
You should see: The workbench with the page preview.
- 2
Change text in place
On: WorkbenchDouble-click a piece of text in the preview and type the new wording.
You should see: The text changes in the preview.
- 3
Edit one element
On: WorkbenchHover an element until it is outlined, then click once. The edit window has three tabs: Style for colours, spacing and size without using AI, AI to describe a change to just that element, and HTML to edit its code.
You should see: Only the element you clicked changes.
- 4
Ask for a bigger change
On: WorkbenchFor changes to the whole page, type them in the chat, for example "Add a pricing section with three plans under the features", and send.
You should see: The page updates in the preview when the reply finishes.
- 5
Insert a ready-made section
On: WorkbenchOpen the Section library, choose a category such as hero, features, pricing, testimonials, FAQ or contact, and insert a section. It is added to the end of the active page with your brand colours.
You should see: The new section appears at the bottom of the page. Inserting from the library uses no credits.
- 6
Undo
On: WorkbenchIf a change made things worse, undo the last AI change with Ctrl + Z (⌘ Z on a Mac).
You should see: The page returns to how it was before that change.
Tips
- The header and footer are shared: edit them once and every page changes.
- Each page has its own chat, so open the page you want to change before typing.
Troubleshooting
- The buttons above the preview are greyed out.
- They are "Available when the AI finishes generating". Wait for the reply to finish.
- The AI changed more than you asked for.
- Undo it with History, then ask again and name the exact section. To change one piece only, use Edit elements.
One row per shot, in the same order as the guide. Estimated length 2:27, recorded signed in as Owner. Use made-up data only. How to record
Say: Edit a website in the workbench. Change text and styles by clicking, ask for bigger changes in the chat, add ready-made sections and undo a change.
Hold until you see: Lesson title on screen for three seconds.
Say: Open Web Design in the project and open the site.
Hold until you see: The workbench with the page preview.
Say: Double-click a piece of text in the preview and type the new wording.
Hold until you see: The text changes in the preview.
Say: Hover an element until it is outlined, then click once. The edit window has three tabs: Style for colours, spacing and size without using AI, AI to describe a change to just that element, and HTML to edit its code.
Hold until you see: Only the element you clicked changes.
Say: For changes to the whole page, type them in the chat, for example "Add a pricing section with three plans under the features", and send.
Hold until you see: The page updates in the preview when the reply finishes.
Say: Open the Section library, choose a category such as hero, features, pricing, testimonials, FAQ or contact, and insert a section. It is added to the end of the active page with your brand colours.
Hold until you see: The new section appears at the bottom of the page. Inserting from the library uses no credits.
Say: If a change made things worse, undo the last AI change with Ctrl + Z (⌘ Z on a Mac).
Hold until you see: The page returns to how it was before that change.
Say: That is edit a website in the workbench. The written steps are on this lesson's page in the ItzSEO course.
Hold until you see: End card with the lesson link.
Reference articles on this topic
Mark it complete to keep your place in the course.
Related lessons
Check the site for issues, publish it to a free address, connect your own domain and roll back if something goes wrong.
Answer a short brief about the business and let the first version of the site be built for you.
Bring a finished article into a project without having a single word changed.