What is a Lightbox Popup? And How to Create It (Step by Step)

Are you wanting to create lightbox popups to capture more email leads? We can show you how.

There’s a reason why cinemas and the theatre turn the lights out before a show. It’s the same reason that lightbox popups show up the way they do, on top of the page that you’re viewing and with a darkened background.

Care to take a guess why that is?

If you answered, “to grab the viewer’s attention,” you’re spot on.

Lightbox popups (also called modal popups) are one of the most effective ways to convert your website visitors into email subscribers and customers.

In this post, we’ll share how you can create your own lightbox popups and the top 6 reasons why they are the best at building your email list, delivering a targeted ad message, and converting subscribers into paying customers.

But if you are ready to get right to creating, click here to jump to the tutorial!

What is a Lightbox Popup?

A lightbox popup is a web form that appears on top of the webpage that you are viewing. When it appears, the webpage is darkened in the background, so the form stands out.

Lightbox popups are most commonly used as optin campaigns for capturing email addresses. However, they can be used to display pretty much any call to action (such as, “Like us on Facebook” or “Use this coupon code at checkout“).

Are you ready to try a lightbox popup on your site?

Let’s keep going.

How to Create a Lightbox Popup

The easiest and smartest way to create popups in WordPress is through OptinMonster:

OptinMonster is a premium WordPress plugin where you can easily create your own lightbox popup.

OptinMonster’s incredibly easy to set up and run. With a powerful yet simplistic builder, all of the hard work has been done for you. No more manual integration. Just a few clicks and your lightbox popup is live.

And don’t forget, OptinMonster comes with targeting rules so you can show your visitors the exact campaigns you want at the second you want:

• Exit-Intent® Technology: recover users actively leaving your site.
• Onsite Retargeting®: keep users engaged by showing fresh campaigns.
• MonsterLink™: boost engagement by showing offers based on what buttons and links your visitors click.

This level of personalization will not just increase the user experience (UX) but will drastically increase your conversions and sales.

For today’s tutorial, we’ll be using OptinMonster to create our own lightbox popup.

In fact, OptinMonster helped LeadFuze score 4x more conversions using popups.

If you’d like these same results, get started with your own 100% risk-free OptinMonster account today:

We understand that not everyone learns in the same way. That’s why we made this helpful video tutorial for our visual learners:

But if you are here for a written step-by-step guide, let’s get to it.

Step 1: Create a Campaign

First, start by signing up for OptinMonster or log in to your existing account.

Once you are logged in, click on the green Create New Campaign button:

To create a lightbox popup, click on the Popup campaign type:

Next, you’ll have the optin to choose from 50+ professionally designed templates for your design.

Today, let’s select the Basic template. It’s the perfect template for any campaign, especially if you want to do a lot of customizations:

Now, give your campaign a name. The name is for your use only, so make it something that will be meaningful and memorable for you.

At this point, you can also add the website where you plan to use the campaign:

Finally, press Start Building when you’re ready to create the campaign. This will take you to the OptinMonster campaign builder.

Step 2: Edit Your Campaign

In this step, we’ll be customizing the visual parts of your lightbox popup.

So, how do we do that? Point and click.

It really is that simple.

For any text changes, you can handle that right in the visual preview on the center of your screen.

Any other changes will open a menu on the left side of your screen:

Also, you can add other elements to your popups like additional columns, countdown timers, videos, and more.

Just drag and drop where you’d like the element:

Once your campaign looks the way you want, you’re ready to set your display and targeting rules.

Step 3: Set Display Rules

Display rules control when your campaign shows up on your site and who sees it.

By default, all campaigns are set to display on any page after 5 seconds.

To review or change this, click on the Display Rules tab on the top of your screen:

You can either click on the drop-down menus to edit the default ruleset or you can click on the + Add New Ruleset button to create your own rulesets.

Many of our customers have great success with exit-intent popups, we’ll be using the Exit-Intent® rule. This rule will display your lightbox popup anytime OptinMonster detects that your site visitors are actively leaving your page.

So, go ahead and click on the drop-down menu and select the Exit-Intent® rule:

There’s so much you can do with OptinMonster’s display rules engine, from follow-up campaigns to onsite retargeting and more. We highly recommend taking some time to play around and test out all of the OptinMonster rules so you can see what works best for your site.

Step 4: Set Up Your Email Integration

While your lightbox popup is collecting leads, they need to be stored somewhere.

Luckily, OptinMonsters integrates with the top email programs so you can automatically feed your new leads to your email lists.

To do that, go to the Integrations tab.

Then, click on +New Integration. You’ll then see a drop-down list full of marketing platforms that you can integrate with OptinMonster.

Select your platform. OptinMonster will walk you through the next steps. For most, all you’ll need is the API Key for the marketing program.

If you are needing an email service provider, we recommend Constant Contact because the platform offers a lightweight, user-friendly interface, but you’re welcome to check out our list of the best SMTP services for more options.

Step 5: Publish Your Lightbox Popup

Once you are happy with how your lightbox popup looks and will display, move over to the Publish tab.

Take a minute to double-check all of your settings and display rules are set the way you want. Also on this screen are instructions on how to add this popup to your website.

When you are ready to publish, just click on the Publish button.

If you need more information, take a look at the documentation for embedding OptinMonster on your site.

Now you know exactly how to create a lightbox popup using OptinMonster!

That’s it! Your WordPress lightbox popup is live!

6 Reasons Why Lightbox Popups Capture More Emails

There are several reasons why lightbox popups capture more emails than a traditional email optin form, like the ones you’ll see in the sidebar of a blog.

For the record, we do recommend having a sidebar optin form like the one above because that’s where your biggest fans will look for it.

However, if you don’t also have an email subscription popup installed on your site, then you’re potentially missing out on thousands of email subscribers. That is not so cool.

So, without further ado, here are the top 6 reasons why a lightbox popup is your best bet at capturing more emails.

1. Lightbox Popups Feature One, Clear Call to Action

Lightbox popups remove all other distractions, so there is only one, clear call to action in view on the page.

With a lightbox popup, the rest of the screen becomes darker and the user’s eye naturally goes to your message and the email signup form. This makes it perfectly clear what the user should do next.

2. Lightbox Popups Are Eye-Catching

When your lightbox popup appears on the page (particularly if it uses an animation), your visitors won’t be able to help but take notice. In fact, they’re impossible to ignore.

That’s exactly why they work so well.

The key is to personalize your popups and trigger them at the right moment, to the right visitors, with the right offer (see #3, #4, and #5 below).

3. Lightbox Popups Trigger at Just the Right Moment

If you use OptinMonster, you can control exactly when your lightbox popup will appear, to make sure that it triggers at just the right moment.

The key to deciding when to trigger your lightbox popup is to think about your user and their intent at the moment they’re browsing your site.

4. Lightbox Popups Display an Interest-Based Offer

The other opportunity you have with OptinMonster is to increase your conversions by displaying a lightbox popup based on interest.

If they’re browsing recipes, you could show them a cooking-related offer. If, on the other hand, they’re browsing home improvement posts, you’d do better to show them an offer related to home decor.

Here’s an example from CountryLiving’s website. This popup appears to visitors who’ve viewed home improvement posts:

But if the visitor has viewed recipe posts, they’ll see this popup instead:

With OptinMonster, lightbox popups can be set to be displayed on specific pages, posts, or even entire categories of posts on your site.

5. Lightbox Popups Are Personalized for Specific Visitors

OptinMonster also allows you to display lightbox popups only to specific visitors. This way, you can personalize your offers even further.

For instance, you could show your popup to visitors coming from a specific ad campaign. You know a lot about the people you target your ads to, so use that information when writing your popup copy.

6. Lightbox Popups Capture Abandoning Visitors

Did you know that 70% of visitors who abandon your site will never come back again?

In most cases, this means that 95%-98% of your marketing efforts are going to waste, and you’re losing money in customer acquisition costs.

However, lightbox popups triggered on exit-intent give those abandoning visitors one last chance to optin which can mean an additional 2-4% of your visitors converting into email subscribers (and customers soon after).

OptinMonster’s Exit-Intent® technology works by tracking the mouse movement of your visitor. When they gesture towards the top of the page, getting ready to close the window, the smart lightbox popup appears.

Ready to put the power of lightbox popups to work for you? Then sign up for OptinMonster today.

And that’s all for this tutorial.

We hope you enjoyed this article. If so, check out these other resources:

• 40 Exit Popup Hacks and Examples to Grow Your Email List
• How to Generate More Leads From Your Website: 9 Expert Tips
• How to Calculate Website Conversion Rate (3 EASY Methods)

Published by Deana Weinheimer

Deana Weinheimer is a writer with deep experience in marketing and WordPress with a focus and passion in educating her readers. In her free time, she enjoys writing for a minor league hockey news site, traveling with her husband, playing with her dogs and gerbils, or paddle boarding the many waterways of Ohio.