Popups and Display Conditions

Overview

StretchPages lets you go beyond a static page with popups and display conditions. Popups are overlays that appear based on a trigger — like exit intent or a button click. Display conditions decide whether an element (or a popup) is shown to a given visitor, based on their device, login state, the date, or bound data. Together they power promotions, announcements, and personalized pages.

Popups

A popup is a designed overlay with its own content and a trigger that decides when it appears.

Popup triggers

• Load — show when the page loads.
• Exit — show on exit intent (when the visitor moves to leave).
• Click — show when a specific element is clicked.
• Delay — show after a set number of seconds.
• Scroll — show after the visitor scrolls to a point.

Create a popup

1. Open the Popups panel in the inspector.
2. Create a new popup and give it a name.
3. Design its content on the canvas like any section — heading, text, an offer, and a button.
4. Choose a trigger (for example, Exit with default settings, or Delay with a value in seconds).
5. Optionally add display conditions so it only shows to certain visitors.
6. Save. The popup will appear on the published page according to its trigger.

Display conditions

Display conditions control visibility. You can add them to individual elements and to popups.

Condition types

• Device — show or hide based on desktop, tablet, or mobile.
• Logged in — show or hide based on whether the visitor is signed in.
• Date — show or hide within a date range (great for time-limited promotions).
• Data — show or hide based on bound data values.

Add a display condition to an element

1. Select the element (or open the popup) you want to conditionally show.
2. Add a display condition and choose its type (device, logged in, date, or data).
3. Set the operator and value (for example, device is mobile; or date between two dates).
4. The element or popup now only appears when the condition is met.

Example: a first-week launch offer

You add an exit-intent popup offering a discount code. You set a date condition so it only shows during your launch week, and a device condition so it only appears on desktop, where your exit-intent detection is most reliable. When launch week ends, the popup stops showing automatically — no need to edit the page.

Example: a mobile-only banner

You add an Alert element with a "Call us" button and give it a device: mobile display condition, so desktop visitors never see it, but mobile visitors get a tap-to-call banner.

Tips

• Match the trigger to the intent. Exit intent is great for "don't leave" offers; delay and scroll suit engagement prompts; click is best for "learn more" details.
• Use date conditions for promotions so they turn on and off on schedule without manual edits.
• Don't stack too many popups. One well-timed popup converts better than several competing ones.
• Combine conditions (e.g., date + device) for precise targeting.
• Test the live page, since triggers like exit intent and scroll behave on the real published page.

Troubleshooting

My popup never appears. Check the trigger settings (a delay value that's too long, or a scroll point that's past the page). If it has display conditions, confirm they're actually met for you (device, date range, login state).

My popup appears too often. Reconsider the trigger — a load popup shows every visit. Consider exit or scroll triggers, and add conditions to narrow the audience.

An element is hidden when it shouldn't be. Review its display conditions — a lingering date range or device condition may be excluding you. Remove or adjust the condition.

Exit intent doesn't fire on mobile. Exit intent relies on cursor movement, which mobile lacks. Use a delay or scroll trigger for mobile audiences, or target the popup to desktop.

FAQ

Can a button open a popup? Yes — use a click trigger tied to the element.

Can I show different content to logged-in visitors? Yes — use the logged in display condition on the elements you want to vary.