Using the Visual Builder

Build beautiful pages without writing code

Using the Visual Builder

Build beautiful pages without writing code

Website

Using the Visual Builder

The visual builder is your design studio. Add sections, arrange content, customize styles—all by clicking and dragging. No code required.

Opening the Builder

  1. Go to Website > Pages
  2. Click on any page
  3. The visual builder opens automatically

[SCREENSHOT: Visual builder interface overview]

The Interface

  • Left panel: Section library and page settings
  • Center: Live preview of your page
  • Right panel: Settings for selected section
  • Top bar: Save, preview, and publish options

Adding Sections

  1. Click Add Section or the + button
  2. Browse available section types
  3. Click a section to add it
  4. It appears on your page—drag to reposition

Section types include:

  • Hero banners
  • Text blocks
  • Image galleries
  • Feature grids
  • Testimonials
  • Contact forms
  • And more

Selecting and Editing

Click any section to select it:

  • Blue outline shows what's selected
  • Right panel shows that section's settings
  • Drag handles appear to move it

Editing Text

  1. Click the section
  2. Click directly on text to edit
  3. Type your content
  4. Use the toolbar for formatting

Changing Images

  1. Click the section with the image
  2. Find Image in the right panel
  3. Click Change or Upload
  4. Select your new image

Reordering Sections

Drag sections up or down to reorder:

  1. Hover over a section
  2. Grab the drag handle
  3. Move to new position
  4. Release

Section Settings

Each section has customizable settings:

  • Content: Text, images, buttons, links
  • Layout: Alignment, spacing, columns
  • Style: Colors, backgrounds, borders
  • Visibility: Show/hide on different devices

Explore the right panel when a section is selected.

Saving Your Work

  • Save: Saves as draft (not live yet)
  • Preview: See how it looks in a new tab
  • Publish: Push changes to your live website

Tip: Save frequently! The builder auto-saves periodically, but manual saves ensure nothing's lost.

Undo/Redo

Made a mistake?

  • Undo: Ctrl/Cmd + Z
  • Redo: Ctrl/Cmd + Shift + Z

Or use the undo/redo buttons in the toolbar.

Mobile Editing

Toggle between device views:

  • Desktop
  • Tablet
  • Mobile

Check how your page looks on each. Some sections let you customize content per device.

Common Questions

Can I copy a section?

Click the section, then click the duplicate icon to create a copy.

How do I delete a section?

Select the section and click the trash icon, or press Delete.

The builder feels slow. What can I do?

Try:

  • Refreshing the page
  • Using Chrome or Firefox
  • Closing other browser tabs

Need help? Contact support.

Was this article helpful?

Thank you for your feedback!

Related Articles