Building and designing a popup

Under the Layout tab, five popup types are available:

• Modal — a centered pop-up window over your page. Modals are always centered and don't have adjustable positioning
• Slide-in — appears sliding in from an edge of the screen
• Sticky bar — a bar fixed to the top or bottom of the page
• Fullscreen — takes over the entire screen
• Inline — embedded directly within your page content rather than floating above it

Each type changes how intrusive or subtle the popup feels. A Modal or Fullscreen popup is more attention-grabbing, while a Sticky bar or Inline popup is less disruptive to someone actively browsing.

Switch to the Design tab on the right to control the popup's appearance in detail.

Colors

• Background — your popup's background color, with both a color swatch and hex code field, such as #ffffff
• Overlay — the color of the dimmed background behind your popup, such as #0f172a

Size & Shape

• Width (px) — your popup's width in pixels, for example 440
• Border radius — a slider controlling how rounded the corners are
• Overlay opacity — a slider controlling how dark or see-through the background overlay is

Copy

• Headline — your popup's main heading, for example "Get 10% off your first order"
• Body text — supporting text underneath, for example "Join our list for launches, offers, and useful updates."

Button

• Label — your button's text, for example "Subscribe"
• Button color and Text color — each with a swatch and hex code field

Image

An optional image can be added via URL or Upload, with a Position dropdown, such as "top", controlling where it sits within the popup.

Animation

A dropdown, for example "fade", controls how your popup appears on screen.

Under Fields, you define what you're actually asking visitors for.

By default, you'll see an Email field, shown with its placeholder text, such as you@example.com, reorder arrows to change field order if you add more than one, a delete icon, and a "Required (always)" checkbox, meaning a visitor can't submit the popup without filling it in.

Three more tabs sit alongside Design on the right: Triggers, Targeting, and Success.

Based on their names, these are where you'll control when your popup appears, who sees it, and what happens after someone submits it:

• Triggers — controls when the popup appears, such as after a time delay or a certain scroll depth
• Targeting — controls who sees it, such as visitors on specific pages or particular visitor types
• Success — controls what happens after submission, likely a confirmation message or redirect

Refer to the popup builder directly for the exact options available in each, since this article focuses on the Layout, Design, and Fields tabs shown in detail.

Start with a Modal, since it's the most common and attention-effective type for a first popup.

Keep your headline short and benefit-focused, like the "Get 10% off your first order" example, and keep your Fields to just Email unless you have a specific reason to ask for more. Extra fields tend to reduce how many visitors actually complete the popup.

Always preview on both desktop and mobile before publishing, since a popup that looks right on a large screen can sometimes feel cramped or awkward on a phone.