Help Center
New to VisionScaper?
Start here
Help Center › Admin screens, field by field › Settings → Appearance & layout: save, publish, history and site controls
Settings → Appearance & layout: save, publish, history and site controls
Preview on devices, save draft, publish with report, history, saved themes and the site owner locks and permissions.
On this page
This article covers the bottom bar of Settings → Business → Appearance & layout, the review and publish window, Preview on devices, the History tab and the Site controls tab. These decide how your look is saved, checked, published and rolled back.
Before you start
- Which button you see depends on the scope under Change the look for. Just me has Save my look. My business and Whole site have Save draft and Review & publish.
- Site controls appears only for the site owner on the Whole site scope.
Fields
Bottom action bar
| Field (exact label) | What it does for VisionScaper | What to enter and example | Default / notes |
|---|---|---|---|
| 📱 Preview on devices | Opens the real app inside a frame, with your unsaved look, at a chosen device size. Nothing is saved from this window. | Press it. Choose a Device (Phone 390, Tablet 768, Laptop 1280, Desktop 1440, Large 1920) and a Screen (Home; contractors also Overview, Marketing, Customers, Calendar, Invoices, Settings). | Contains 📐 Check all widths on this screen. |
| 💾 Save my look (Just me) | Opens the Check & save window; the Save my look button inside saves your personal look on every device. | Press, read the report, press Save my look. | Shows “💾 Saved” when nothing has changed. Blocked while readability problems exist. |
| 📝 Save draft (My business, Whole site) | Stores your work as a draft. Only you see it until you publish. | Press it. | Message “Draft saved — only you see it until you publish.” |
| 🚀 Review & publish (My business, Whole site) | Opens “Preview & validation report” with What changed, readability checks and a screen-size check, then a Publish button. | Press it, read, then Publish. | A known-good copy is kept automatically so you can roll back. |
| Reset to inherited look (Reset to VisionScaper default on Whole site) | Throws away your changes and returns to the look you inherit. | Press it. Use Undo if you pressed by mistake. | — |
Review and publish window
| Field (exact label) | What it does for VisionScaper | What to enter and example | Default / notes |
|---|---|---|---|
| What changed | Lists the groups you changed (Brand colors, Colors, Text, Shape, Spacing, Motion, Icons, Light / dark, Area colors, Name) and what each affects. | Read it. | Display only. |
| Readability (contrast) list | Each color pair with its contrast ratio and the ratio needed. A cross means it fails. | Open Details on the status line or read here. | Blocking failures disable Publish or Save. |
| Adjusted automatically | Lists colors VisionScaper changed to keep text readable (from → to). | Read it. | Display only. |
| 📐 Check every screen size (button) | Opens your real screens at 9 widths (320 to 1920 px) and compares them with the default look. | Press and wait. Each width shows a tick or a cross. | Publishing is blocked if this finds a new problem. |
| Publish / Save my look (button in the report) | Publishes (business and site) or saves (personal) your look. | Press once. | Toast: “Published. The previous version is in History.” or “Saved — this is your look on every device.” |
History tab: Just me
| Field (exact label) | What it does for VisionScaper | What to enter and example | Default / notes |
|---|---|---|---|
| Your earlier looks & layouts: Restore | Each time you save, the previous look is kept. Restore brings one back. | Press Restore on the row. | Message “Restored.” |
| Go back to the default look & layout | Clears your personal theme and layout. | Press it. | Message “Back to the default look and layout.” |
History tab: My business and Whole site
| Field (exact label) | What it does for VisionScaper | What to enter and example | Default / notes |
|---|---|---|---|
| 🛟 Roll back to the last known-good version | Publishes the last version that passed checks. | Press it. | Disabled until a known-good version exists. |
| ⏏️ Unpublish (use the default) | Removes the published look so the default look returns. | Press it. | Disabled if nothing is published. |
| Published versions: Preview | Previews that older version in the editor (not live). | Press Preview. | Publish to bring it back. |
| Published versions: Restore | Makes that older version live. | Press Restore. | The last 20 published versions are kept. |
| Theme name (box) | Name for a saved theme copy. If left empty it is called “[name] copy”. | Type e.g. Fall look. | — |
| ⧉ Save as new theme | Saves the current look as a named theme without publishing. | Press it. | Up to 10 saved themes. |
| Saved themes: Load | Loads the saved theme into the editor. | Press Load, then publish. | — |
| Saved themes: Delete | Removes a saved theme. | Press Delete. | Cannot be undone. |
Site controls tab (site owner, Whole site)
| Field (exact label) | What it does for VisionScaper | What to enter and example | Default / notes |
|---|---|---|---|
Colors and branding locks.colors |
Locks colors so businesses and people cannot change them. | Tick to lock. | Off by default. |
Fonts and text locks.type |
Locks the Text tab. | Tick to lock. | Off by default. |
Corners, borders and icons locks.shape |
Locks shape settings. | Tick to lock. | Off by default. |
Spacing locks.density |
Locks spacing. | Tick to lock. | Off by default. |
Motion locks.motion |
Locks animation speed. | Tick to lock. | Off by default. |
Light / dark mode locks.mode |
Locks the light/dark choice. | Tick to lock. | Off by default. |
Layout (order of squares, menus and sections) locks.layout |
Locks layout changes. | Tick to lock. | Off by default. |
Contractors can brand their own business allow.business_theme |
Lets contractors use the My business scope. | Tick to allow. | — |
Everyone can choose their own colors allow.user_theme |
If unticked, people can only change light/dark, text size, spacing and motion. | Tick to allow. | — |
Everyone can rearrange their own screens allow.user_layout |
Lets people rearrange their own screens. | Tick to allow. | — |
AI theme and layout assistants allow.ai |
Turns the AI theme and layout assistants on or off for everyone. | Tick to allow. | — |
| Save site controls (button) | Stores the locks and permissions. | Press once. | Message “Site controls saved.” |
(Default ticks for the site controls are not set in the screen code; the saved values are shown when you open the tab.)
Steps
- When you are happy with your look, press Preview on devices and check Phone and Computer.
- Press Review & publish (or Save my look).
- Read What changed and the readability list.
- Press Check every screen size and wait for the ticks.
- Press Publish.
- Later, open the History tab to restore, preview or roll back.
- Site owner: open Site controls, tick locks and permissions, press Save site controls.
Tips
- Use Save as new theme to keep a seasonal look ready without publishing it.
- A draft is private to you. Customers and crew see nothing until you publish.
- If something looks wrong live, use Roll back to the last known-good version first, then investigate.
If something goes wrong
- Publish is greyed out. A readability failure or a new screen-size problem is blocking it. Fix the colors listed.
- Preview on devices stays on “Loading”. The frame waits up to about 20 seconds; try again.
- Restore is missing. Only the owner of that scope sees Publish, Restore and Roll back.