The Visual Editor
Learn the builder interface, preview modes, save behavior, and publishing model.
The Visual Editor is where you shape the storefront customers will see. It keeps page structure, theme design, navigation, preview, and selected-section editing in separate surfaces so each decision has a clear place.
Layout overview
| Area | Position | Purpose |
|---|---|---|
| Top bar | Top | Save, publish, visit the store, and understand draft or live state. |
| Pages | Left rail | Select pages, select sections, and control page or section visibility. |
| Design | Left rail | Adjust theme-level controls available for the active theme and plan. |
| Navigation | Left rail | Choose which enabled pages and category links appear in the header. |
| Site | Left rail | Store identity, SEO, analytics, Discord, and site-level settings. |
| Preview | Center | Review the storefront in desktop, tablet, and mobile sizes. |
| Inspector | Right | Edit content, layout, style, or page properties for the current selection. |
| Status bar | Bottom | See save status, selected page or section, viewport, undo/redo, and shortcuts. |
Pages and navigation are different
Pages controls what exists on the storefront. Navigation controls what appears in the header. A page can exist without being linked in the header.
Working with the preview
The center preview is the fastest way to work like a customer. Click a section to select it; the Inspector opens with the controls that belong to that section or page.
Switch between responsive modes using the device icons in the top bar:
- Desktop: Full-width view
- Tablet: Medium breakpoint
- Mobile: Narrow viewport
Use preview mode for every serious change before publishing. A layout that feels balanced on desktop can still need work on mobile.
Keyboard shortcuts
| Shortcut | Action |
|---|---|
Ctrl + S | Save changes |
Ctrl + P | Toggle publish state |
Ctrl + \ | Toggle left panel |
Escape | Deselect current section |
Saving and publishing
Changes are not auto-saved. The preview can show your latest unsaved work, but persistence requires Save.
Use Ctrl + S or the save action in the top bar when the change is ready. Publishing is separate, so an unpublished store can keep saved draft changes without becoming public.
If a store is already published, saved storefront changes update the live storefront. Review the customer path first, then save.
When publishing with pending changes, the editor saves first and then publishes the storefront.