Popups

Popups are overlays you design once and show to visitors at the right moment — welcome messages, newsletter signups, discount codes, and more. The editor focuses on a small set of blocks and preset controls so you can ship something polished without wrestling with layout code.

Popups in 3 minutesTutorial · 2–4 min · Not recorded yet

Script to read

Hey — in this walkthrough I want to show you popups in Leadara. I'm in the dashboard under Popups, and I'll hit Create popup to open the editor.

The canvas in the middle is your popup. On the left I have the layer list — that's how I select what's inside the popup. When I need another block I click Insert and pick text, a button, an image, or an email field. No giant component library to hunt through.

I select the heading on the canvas and the right panel shows just what matters: the words, heading level, and a few Look presets for size and color. Same for the button — its label and what it should do: close the popup, open a link (I just paste the URL right there), or submit the form.

For position, backdrop, and which pages see this popup, I open Settings in the header. There I can dim the page behind the popup, pick the backdrop color, add a little blur, and choose whether clicking outside closes it.

Now the fun part — see this sparkle button up top? That opens the AI assistant. Instead of a one-shot generator, it's a chat: it can see the popup I'm working on right now, so I can say "make this a newsletter signup with an email field and a Subscribe button", watch it rebuild the popup live, then follow up with "make the heading bigger and the button green" and it edits what's already there. When it looks good I hit Save, flip Active on, and wire the popup into a journey or targeting rule later.

And when a visitor fills in that email field and hits Subscribe, their details flow straight into your audience so you can follow up. The close button is available in the Insert menu too, so visitors always have a way out.

What you can do

• Create popups from templates, a blank start, or by chatting with the AI assistant
• Add text, buttons, images, inputs, checkboxes, and a close button via the Insert menu
• Point a button at a link (with open-in-new-tab) or have it close the popup or submit the form
• Capture leads: form fields flow into your audience when a visitor submits
• Tune position, backdrop color, dimming, blur, and URL rules in the settings dialog
• Preview the popup as visitors will see it before you save
• Attach popups to journeys or show them with your site targeting rules

The AI assistant

Open the assistant from the sparkle button in the editor toolbar. It's a chat that already knows the popup you're editing, so you can:

• Build a popup from scratch — "create a discount popup with a code and a Copy button"
• Edit what's on screen — "make the heading bigger", "change the button to green", "add an email field"
• Iterate turn by turn; each reply rewrites the live popup so you can keep refining

Whatever it produces lands right in the editor, where you can fine-tune it by hand and save when you're happy.

How the editor works

The layer list is your structure. Select any block to edit its content and look on the right — typically fewer than six controls per block. Containers get quick layout presets (stack vertically, row, centered) plus spacing tokens instead of raw CSS.

Popup chrome (backdrop dimming, color, blur, close behavior) lives in Settings, outside the canvas. A close button is added for you on new designs, and you can drop additional ones from the Insert menu.

Tips

• Newsletter popups: heading, short description, email input, Subscribe button with action Submit — give the email field a clear mapping so it lands in your audience
• For a link button, set its action to Link and paste the destination URL
• Keep one clear CTA; extra buttons dilute the message
• Test on mobile width presets (320–480px) — popups are fixed-size overlays, not full pages
• New popups start inactive — they won't show on your site until you turn Active on
• Pause a popup anytime with Active off; drafts stay editable