The Popup, Banner & HTML Builder is the workhorse action for showing content: promos, announcements, coupon popups, spin-the-wheel games, hero sliders, floating chat buttons, progress trackers — anything built from a template or your own HTML, shown as a popup, a bar, a full-screen takeover, or inline in the page.
Adding one
- In a Targeting & Personalization campaign, open the Content step and click Add action.
- Pick Popup, Banner & HTML Builder. The template gallery opens. You can also Start blank and paste your own HTML, or copy from an action you already built.
The families in the gallery (each links to its own detailed article):
- Coupon Popup — promo code with click-to-copy / blur-reveal.
- Spin Wheel (stacked and side-by-side/full-screen) — gamified prize wheel.
- Hero Slider — up to four rotating slides.
- Announcement Bar and Rotating Announcement Bar — top/bottom strips.
- Status Tracker and tiered progress bars — live goal / loyalty progress from profile values.
- Hover Bubble CTA — floating corner button that opens a message bubble (start a chat, book a call).
- Center Modal, Full-Screen Overlay, Corner Toast, System Message, vertical drawers and banners.
- Multi-Step Quiz — guided-selling questionnaire.
The editor
Step 1 — Design Your Banner or Popup. Click any element directly in the live preview, or expand its group in the sidebar. Every setting has a ⚡ Variations button — audience-based cases (language, country, returning visitor, CRM field…) with a default fallback, exactly as described in the countdown guide.
What the groups hold (Coupon Popup shown; other templates vary):
- Style — color preset, image layout, corners, entrance animation (pop…), card shadow, advanced card CSS.
- Coupon Code — the code itself and its Reveal Style: copy (click to copy to clipboard), reveal (blurred until clicked), display (always shown).
- Text — eyebrow, title, body, fine print; each with a show/hide toggle, its own CSS hook and Variations.
- Button — text, then Open link (same/new window) or Run JavaScript; Count clicks here (click target) marks it as the CTR click target; optional animation.
- Close — keep the built-in ×, or pick from the icon library (24 icons) or a custom image. Don’t show again for N sessions: after a visitor closes it, it stays hidden that many sessions — 0 lets it return next visit, 999 effectively never shows it again.
- HTML Source (advanced) — the full markup, for developers.
Toolbar: Preview as on phone / tablet / desktop, Change template, Add to your templates (saves your customized version for reuse), and Edit action with AI — describe the change in plain language and the AI restyles or rewrites the action.
Display rules & placement
Step 2 — Set Display Rules & Placement:
- Inline element — renders inside one or more placeholders; stacks with your page content.
- Floating popup — pick a screen position; then entrance animation, optional dimmed modal backdrop, scroll behaviour, close button, auto-close. Settings that only apply to popups show disabled for inline — the screen keeps its shape.
- Until you choose a placement, the action has nowhere to render — the step says so explicitly, so an invisible action is never a mystery.
- Triggers — on page enter / after delay / when idle; scroll %, rescroll to top, text copied; predicted exit intent (desktop); or your own click/hover popup trigger. First match opens it.
- Frequency caps — stop after closing / clicking / N impressions, burst mode, spacing after other popups — each rule restated in plain language with your numbers.
Measuring it
The button marked click target feeds the action’s CTR; impressions, clicks and closes report to the campaign’s Performance step and, if enabled, to Google Analytics. To test designs against each other, activate A/B testing on the Content step.
