Lightbox popups are some of the most popular popup formats. They enable you to focus your visitors attention on your message. And if displayed at the right time they can prove to be very effective. Let’s review the basics of lightbox popups together.

What is a lightbox popup?

A lightbox popup is a popup that appears on top of the page’s content while the rest of the website is inactivated and dimmed out.

lightbox popup example

A lightbox popup promoting a Black Friday offer on Turntable Lab.

It was named after the Lightbox JavaScript library.

When should you use lightbox popups?

As a marketer Lightbox popups enable you to grab your visitor’s attention and focus on your message. When they’re displayed your visitors are left with only 2 options: take action within the popup or close it. As such they are very powerful: your message can’t be ignored. But with great power comes great responsibility. Too many lightbox popups can hurt your visitor’s experience.

To make sure lightbox popups are the appropriate format for your popup, you can ask yourself the following questions:

  • Is my message worth interrupting my visitor’s navigation?
  • Is the benefit for my user big enough to justify that interruption?
  • As a visitor, what are the chances I would find that popup intrusive?

Here are some examples of situations where lightbox popups are appropriate:

  • To share an important announcement (shipping delay, limited support, terms and conditions update)
  • To onboard a new user
  • To promote a big discount
  • To share a message on exit
  • To confirm an important action (for example that the user is above the legal age required to visit your website)

Last but not least: lightbox popups should be used carefully on mobile devices. Google penalizes websites which use popups that make content less accessible. Lightbox popups are explicitly listed among the popup formats which should be avoided on mobile devices.
If you want to display a lightbox popup on mobile, make sure it’s displayed after the first page.

How to prepare the design?

Content

As lightbox popups interrupt your users during their navigation, it’s particularly important to keep your content short and relevant.

Choose your words carefully. Avoid long sentences and use power words to make your message more impactful.

lightbox popup ecommerce

This is how MyRume shared shipping deadlines during Christmas.

Overlay color and opacity

The ‘classic’ lightbox popups darken the website background. But with advanced popup editors, you can choose the color of the overlay and its opacity.
Regarding the color, we recommend choosing either the classic grey or black. But you can also choose a color which matches your website’s visual identity.

Regarding the opacity, UX for the Masses summed it up perfectly:

“Too dark and users will no longer be able to see which page they’re on. Too light and users might think that the page is still active and might not even notice the overlay in the first place.”

Closing options

Closing options are a tricky question: you’ll have to choose between a closing X (highly visible) or a dismiss link. If your closing option is too visible, your visitors risk clicking on them immediately without reading your message. If it’s too difficult to find, your users might be frustrated.

Recently we reviewed optin campaigns totalling 204,775,612 cumulated displays to find out what was the impact of having a simple closing link vs. a closing X. It turns out that the campaigns without a closing [X] outperform those with by +129% on average!

That said, if you want to make sure you are not hurting your website UX, you can monitor the impact on the bounce and/or exit rates using Google Analytics (WisePops comes with a Google Analytics integration which makes that process quick and easy).

What is the recommended targeting?

Use “exit” trigger for the best results
Displaying your lightbox on exit has a major advantage: it catches the users when their session is over. They have nothing left to do on your website. Everything displayed at that moment is just icing on the cake.
Exit popups also perform best. During our internal review, we noticed that they outperform landing popups by +5% (that might not sound like much, but for a website collecting 6,000 emails/month, that’s an extra 300 emails/month and 3,600/year).

Limit displays
To avoid annoying your users, cap your displays and exclude existing subscribers.

WisePops x Lightbox popups

Make the most of your popups with WisePops:

  • Display popups on any kind of website whether it’s a WordPress blog, an ecommerce website, a custom website etc.
  • Easily design all kinds of popups (there are more to popups than lightbox popups).
  • Rely on our 30+ targeting options to reach the perfect audience for your campaigns
  • Monitor the impact on your conversion rate and revenue

Start your free trial today

  • Greg d'Aboville