How to Add A Teaser for Your Lightboxes

A pop-up teaser is a small site widget that, when clicked, shows a larger pop-up or lightbox.

Teasers allow you to minimize or dock a lightbox on the corner of your site window when your site visitors close them. You can use a teaser to remind your visitors that they can access the information or form on your lightbox without obstructing their view, or you can use them to preview the contents of your pop-up before displaying the full pop-up. This can result in more conversions from the associated lightbox.

Teasers are great for newsletter signup pop-ups, which visitors may not want to submit until they’ve read a bit of your content first. For eCommerce sites, teasers are great for displaying ongoing promotions, free shipping information, or coupon code information for later access.

To add a pop-up teaser to your site, follow these steps.

Step 1

Log into Digioh and select the lightbox you want to edit.

list of lightboxes in digioh

Step 2

Click the Teaser section on the left side of the editor.

click the teaser tab to add a teaser to your pop-up

Step 3

Set the Display toggle to “On” and choose your teaser’s position and size.

design your lightbox teaser

Add some text, select the font, and choose some colors for your teaser.

add content to your pop-up teaser

Typically, the colors and fonts you use for the teaser should match the contents of your full lightbox.

Step 4

Click Save and Preview.

save and preview lightbox teaser

Step 5

Time to take a look at your new teaser! In the preview window, close your lightbox to see the teaser in action.

close lightbox

The teaser will appear in the position you selected in Step 3.

example of a teaser that docks in corner when pop-up is closed

Step 5

Click Save and Publish to push your changes to your site. Your teaser will now appear on your site when visitors close the associated lightbox.

Related Reading:

Tagged: