Skip to main content

Teaser creation and customization

Teasers are designed to keep your offers within reach without overwhelming visitors

Updated over a month ago

A teaser is a small widget that is set up alongside your popup or floating box. It gives visitors a nonintrusive way to re-open a popup they’ve closed or access it before it appears. Once the popup is closed, the teaser lets users come back to your offer when they’re ready.

How teasers behave

  • Stays fixed to a chosen screen edge (top, bottom, left, right, or a corner) on the page.

  • Hidden while the main popup is active, reappears after it closes.

  • Disappear permanently if a visitor completes the goal action (subscription or playing a game).

  • Can be dismissed forever via the teaser’s close button.

How to create and customize a teaser

Start with a template. Many Claspo’s designs already include teasers. When choosing such a template, just click the radio button to attach it.

Create from scratch. If your design doesn’t include a teaser or you didn’t set it up at the very beginning, you can add one manually in the editor.

To change the default teaser text and style:

  • Double-click the default text to replace it.

  • Use the right panel to adjust font, size, color, or add text shadows, etc.

It’s easy to adjust the teaser’s look:

  • Soften the corners or leave them square.

  • Try shadows or remove them.

  • Pick a background color that fits your design.

When editing the teaser text, you can access additional features in the right panel under Insert. Here you can:

  • Add a Link to make the teaser clickable.

  • Insert dynamic content using Merge tags (see the tutorial).

  • Create a rotating message using Text roller.

These options allow you to make the teaser more interactive and personalized without changing its layout.

From the left panel, you can drop in extras like text, or images.

You can also choose any of eight options for the teaser's location on the screen (top, bottom, left, right). To display a teaser vertically, see the tutorial.

To add a close button, turn on the toggle in the right panel.

Then click the close button to change its look — you can pick the design, color, size, and where it sits.

Teasers don’t behave just one way — you choose when they appear: before the popup, after it closes, or both.

Why use a teaser

  • Recover lost engagement — popups that are closed too soon often mean lost conversions. A teaser brings visitors back.

  • Improve user experience — visitors can interact on their own terms, without interruptions.

  • Drive conversions and retention — easy access to subscription offers, rewards, or incomplete forms encourages action.

  • Stay subtle — teasers sit neatly on the screen edge, visible but not distracting.

Teasers don’t behave just one way — you choose when they appear: before the popup, after it closes, or both.

Learn how they work in Teaser display conditions, and get step-by-step setups in Teaser visibility options and setups.

Did this answer your question?