Skip to main content

​
Overview

The Visual Editor allows you to edit your website directly by clicking on elements. No code knowledge required!

​
Getting Started

  1. Open your website in the editor
  2. Click the “Visual Edit” button in the top navigation
  3. Click on any element on your website to select it
  4. Use the properties panel on the left to make changes

​
Editing Elements

​
Selecting Elements

  • Click any element to select it
  • A blue outline will appear around the selected element
  • The properties panel will show the element’s details

​
Editing Properties

Style Tab

  • Font size, weight, and family
  • Text and background colors
  • Text alignment
  • Border radius

Spacing Tab

  • Margin (outer spacing)
  • Padding (inner spacing)
  • Visual spacing controls

Content Tab

  • Edit text content
  • Update links and URLs
  • Replace images

Actions

  • Duplicate elements
  • Delete elements
  • Copy styles

​
Element Actions

​
Duplicate Element

  1. Select an element
  2. Click “Duplicate” in the properties panel
  3. The element will be copied right after the original

​
Delete Element

  1. Select an element
  2. Click “Delete” in the properties panel
  3. Confirm the deletion
Deletions are permanent. Make sure to save your changes before deleting important elements.

​
Saving Changes

Changes are automatically tracked. When you see “Save Changes” button:
  1. Click “Save Changes” to persist your edits
  2. Your changes will be saved to the backend
  3. The preview will update with your saved changes

​
Tips

The breadcrumb trail shows the element hierarchy, helping you understand the page structure.
All changes are visible immediately in the preview. No need to save to see results.
Use the undo/redo buttons in the top navigation to revert changes.
Use the page selector to edit different pages of your multi-page site.