Widgets
Widgets are the single pieces shown on your website. There are six channel types — each designed for a different purpose.
Widgets need Show everything
Channel types
Popup
A modal overlay that appears in the center of the screen. Best for capturing email sign-ups, showing discount codes, or announcing important news. Popups command the most attention but should be used sparingly to avoid frustrating visitors.
Banner
A full-width notification bar displayed at the top or bottom of the page. Ideal for site-wide announcements, cookie notices, sale banners, or any message that should be visible without interrupting the browsing experience.
Message
A chat bubble widget that appears in the corner of the page and opens a live chat conversation. When a visitor sends a message, it appears in your Inbox for your team to respond. See Live chat & Inbox for details.
Social Proof
A small toast notification that shows recent activity (e.g. "Sarah from New York just signed up"). Great for building trust on landing pages.
Tooltip
A contextual popup anchored to a specific element on the page, identified by a CSS selector. Use tooltips to highlight features, guide users through onboarding, or surface tips in-context.
Embed
An inline widget rendered inside a <div> element you designate with a CSS selector. Unlike other channels, Embeds are part of the page layout rather than overlaid on top of it — perfect for inline sign-up forms or content widgets.
Widget status
- Draft — saved but not live. Visitors cannot see it.
- Published — live. The loader script will display it when targeting conditions are met.
- Paused — temporarily hidden without losing your settings.
- Archived — removed from active use but retained for reporting purposes.
Publishing
Creating a widget
Go to Widgets → New widget. To start from a ready-made design instead, open Templates → Widgets.
Choose a site and a channel type (Popup, Banner, etc.).
Design the widget in the visual editor. Add blocks, set colors, and write copy.
Configure Triggers — when the widget should appear (on load, on scroll, on exit intent, after a delay).
Configure Targeting — which URLs or visitor segments should see it.
Set Frequency — how often the same visitor sees the widget (once, once per session, always).
Click Publish. The widget goes live immediately.
Triggers
Triggers control when the widget is shown to a visitor:
- On page load — shown immediately when the page finishes loading.
- After delay — shown after a set number of seconds.
- On scroll — shown after the visitor has scrolled a percentage of the page.
- On exit intent — shown when the visitor's cursor moves towards the browser's address bar (desktop only).
- On click — triggered when the visitor clicks an element matching a CSS selector you provide.
- From what the visitor does — when they look interested, get stuck, leave a form, go quiet, after several pages or after time on the site.
- When your site sends an event — your own code calls
UTDNotify.event("quote-started")and the campaign waiting for that name opens. See the JavaScript API under Integrations.
Who sees it
A list of rules, on the campaign page under Where it shows and in the designer's Targeting tab. All of them must be true for the campaign to show:
- On a page — the address contains, starts with or is exactly a value. A value starting with
/is a path on your site, like/faq. - Not on a page — never where the address contains a value, like
/checkout. - Where they came from — Google or another search engine, an ad, social media, an email, another website, or straight to the address.
- A link tag — the visit started from a link whose
utm_campaign,utm_sourceorutm_mediumhas a value. - A website that sent them — the referring site contains a value, like
yelp.com. - Their visit number — their second visit or later, and so on.
- A page they've seen — they have, or haven't, visited a page containing a value.
- Another campaign — they saw, closed or filled in another campaign, or didn't.
- Known contact or not — they left their details before, or the site said who they are.
- Day and time — on chosen days between two times, on your workspace's clock. From 18:00 to 08:00 runs through the night.
- Country — in, or not in, a list of countries. Checked from where the visit comes from.
- Browser language, device, and new or returning visitors.
The live chat has its own Messages on certain pages, under its content: a line that fits the page, like “Can't find your answer? Ask me” on your FAQ, shown above the bubble after a few seconds, with the same rules.
Frequency
- Show once — the visitor sees it once, then never again (stored in localStorage).
- Once per session — resets every time the browser session ends.
- Always — show every time the trigger fires. Use with caution.
Form fields
Popups and Embed widgets can include a form to capture contacts. Add fields in the editor's Formpanel — pick a type, set a label and placeholder, mark it required if needed. Supported types:
- Email, Text, Phone, Number — standard visible inputs.
- Long text — a multi-line textarea.
- Dropdown — a select with a list of options you define.
- Hidden — not shown to the visitor, but submitted with the form.
Hidden fields
Use a hidden field to attach extra context to every contact — things like a tenant ID, plan tier, referral source, or any value the visitor doesn't need to see or edit. The submitted value lands in the contact's datapayload alongside the visible fields, and shows up in the dashboard'sExtra fields section, the email notification, and the lead.created webhook.
Two ways to set the value:
- Static value, set in the editor — type the value into the Value input on the field row. The same value is submitted by every visitor. Good for campaign tags like
source: "homepage-popup". - Dynamic per-visitor, set from your site's JavaScript — call
window.UTDNotify.setFormData({ field_name: "value" }). This overrides the static value at runtime. Good for logged-in user info, tenant context, or A/B test assignments.
See Integrations → JavaScript API for the fullsetFormData reference.
Analytics
Each widget tracks four events automatically:
- Impression — the widget was displayed.
- Click — a button or link inside the widget was clicked.
- Conversion — a form inside the widget was submitted (contact created).
- Close — the visitor dismissed the widget.
View these on the widget's analytics tab, or for all widgets in Analytics (with Show everything on). Conversion rate = Conversions ÷ Impressions.