Using the visual editor

Edit any element on your page — text, color, layout — by clicking on it. No code, no theme files.

The visual editor lets you make changes to your live site visually, without writing any code. Click an element, change it, save it as a variant. The original page stays untouched.

Open the editor

From any experiment, click Edit visually. We open your site in an iframe with the editor toolbar attached. The first time you do this on a new domain, you'll be asked to verify ownership — same as the tracker check, takes a few seconds.

Select an element

Hover over the page — elements highlight as you move. Click to select. The toolbar shows the element type (button, paragraph, image, container) and the available edits.

What you can edit

  • Text — double-click to edit inline, or use the toolbar to change font, color, weight.
  • Colors — background, text, border. Pick from your brand palette or paste a hex code.
  • Spacing — padding and margin. Drag the handles or type exact values.
  • Visibility — hide an element entirely on this variant. Useful for testing "with vs without" elements like banners or trust badges.
  • Custom CSS — for everything else, paste a CSS snippet that applies only to this variant.

Mobile vs desktop

Use the device toggle at the top of the editor to preview each breakpoint. Edits apply across all sizes by default — to make a change mobile-only, switch to mobile view first, then edit. The toolbar will scope your CSS to that breakpoint.

Preview before publishing

Click Preview to see your variant live in a fresh tab — no edits to your real site, just a temporary URL with the variant applied. Share it with your team for review before launching the experiment.

What to do now

Made an edit? Save it as a variant and pick a goal, then start the experiment. For tougher cases, the AI editor can suggest changes for you.

Was this article helpful?