Design Tab: Editor Mode
Editor mode provides full editing capabilities with AI assistance and direct manipulation.Activating Editor Mode
Click the Editor tab in the mode switcher (top of preview area).Features
Click to Edit Text
- Click any text element
- Edit directly in place
- Changes save automatically
Right-Click Context Menu
Right-click any element for options:- AI Agents - Block Creator, Block Editor, etc.
- Copy/Paste - Duplicate elements
- Delete - Remove element
- Move - Reposition
Drag and Drop
- Drag elements to reorder
- Drop blocks in new positions
- Visual guides show placement
AI Chat Integration
- Chat sidebar available
- Context-aware suggestions
- Real-time updates
Editing Workflow
- Select - Click an element
- Edit - Modify directly or use AI
- Preview - See changes live
- Save - Click Save or auto-saves
Using AI in Editor Mode
Quick Edits
Select an element, then ask:Block Modifications
Select a section, then ask:Style Changes
Visual Indicators
- Blue outline - Selected element
- Orange outline - Hovered element
- Drag handles - Moveable elements
- AI indicator - Processing status
Tips
- Double-click text for inline editing
- Use Tab to move between elements
- Esc to deselect
- Ctrl/Cmd + Z to undo
Keyboard Shortcuts
| Shortcut | Action |
|---|---|
| Ctrl/Cmd + Z | Undo |
| Ctrl/Cmd + Shift + Z | Redo |
| Ctrl/Cmd + S | Save |
| Delete | Remove selected |
| Esc | Deselect |