How to set up the teaser button
The teaser is a small floating button that appears in the corner of your storefront. It gives visitors a way to open your popup on demand – either before the popup has appeared or after they've closed it.
Where to find it
- Open your campaign and go to the Content tab
- Scroll down to the Teaser section
When the teaser shows
Choose when the teaser button appears on your store:
- Before campaign – shows the teaser before the popup has triggered. Visitors can click it to open the popup early.
- After campaign is closed – shows the teaser after the visitor has dismissed the popup. Gives them a way to get back to the offer.
- Before and after – shows the teaser at all times (most common choice).
- Don't show – hides the teaser entirely. Only the popup itself will appear based on your display rules.
What you can configure
Icon – choose an icon for the teaser button: None, Gift, Discount, Sale, Envelope, or Spin wheel.
Custom text (optional) – add text next to the icon (e.g., "Get 10% off"). Rich text editor.
Style – the visual style of the teaser: Flying button or Tab.
Position – where the teaser appears on the page (e.g., Bottom left).
Offset – fine-tune the teaser's position with top/bottom and left/right pixel offsets.
Different position for mobile – toggle this on to set a separate position and offset for mobile devices. Useful when the teaser overlaps with other elements on smaller screens.
Z-index – controls the stacking order of the teaser relative to other page elements. Default is 100000. Only change this if the teaser is hidden behind other elements on your storefront.
Show close button – toggle on to let visitors dismiss the teaser.
Things to know
The teaser is styled separately. Teaser colors (background, text, close button) are configured in the Styles tab under "Colors – Teaser."
Test on mobile. The teaser can overlap with other floating elements (like chat widgets or Shopify's cookie banner) on mobile. Use the "Different position for mobile" toggle to adjust placement for smaller screens.
If you're not showing the teaser, visitors can only reach the popup through your display rules. Make sure your triggers (time delay, scroll depth, exit intent) are set up so visitors don't miss the popup entirely.