Editor Overview

Editor Overview | Aveiro

In short

The editor opens when you click a site from the dashboard. The left rail switches between AI, Pages, Layout, Components, Styles, and Settings. The main area shows a live preview and your page content in Preview, Visual, or Source mode.

Opening the editor

From Sites, click a site card or choose Edit from the site menu. The URL includes your organization ID, site ID, and /edit. Use the back to Sites control at the top of the left rail to return to the dashboard without signing out.

Layout

The editor is a split view:

Area	Purpose
Left rail	Icons to switch panel tabs (AI, Pages, Layout, Components, Styles, Settings, Integrations)
Left panel	Content for the active tab — file tree, chat, layout slots, integrations, etc.
Top toolbar	Site switcher, page picker, device preview width, edit mode, publish, shortcuts
Preview / canvas	Live preview of the open page, or the visual/source editor when editing

Changes save automatically as you edit. A saved-state indicator shows when content is syncing.

Panel tabs

Tab	Use it for
AI	Chat with Quasar — create pages, rewrite copy, update layout and styles via tools
Pages	File tree, collections, page settings, sort order, create/delete pages
Layout	Site-wide and per-collection layout templates, header, footer, sidebars
Components
Styles
Settings
Integrations

Mode	Best for
Preview	See the page as visitors will — read-only in the canvas
Visual	Click blocks to select, edit text inline, reorder sections
Source	Edit raw MDX directly — full control for advanced users

Section	Topics
AI	Chat, suggestions, applying and reverting AI changes
Pages	File tree, collections, page settings, publish, history
Layout	Templates, slots, collection overrides
Components	Inserting blocks, categories, MDX
Styles	Site theme and block-level styling
Settings	URL, SEO, domain, analytics, publish
Integrations	Fourthwall storefront connect, cart, checkout
Editing	Modes and keyboard shortcuts

Editor Overview

Opening the editor

Layout

Panel tabs

Opening the editor

Layout

Panel tabs

Editing modes

Preview device sizes

Publish from the editor

Version history

Documentation map