How to Build Effective Pop-Ups: An 8-Part Checklist


One of the easiest ways to drive more ecommerce sales month-over-month is by creating and launching new pop-ups on your website. If you’re relatively new to ecommerce, you probably already know that pop-ups are a must, but you might not yet fully understand what separates a nice-looking pop-up from a pop-up that actually drives visitors to convert.

If you spend any amount of time browsing ecommerce websites and analyzing the pop-ups that appear, it won’t take you long to realize that no pop-up is identical. There isn’t really one standard format that works best for everyone—it varies greatly depending on a number of factors, such as branding, audience, development resources, marketing budget, etc.

There are, however, a number of steps you can take and tips you can follow to ensure that you’re building unique pop-ups for your store that look good AND make you more money.
Here’s the 8-step process:

Step 1: Make Your Offer Irresistible

Before you even start building a pop-up for your website, you have to decide what kind of offer you want to present to visitors. This is an extremely important step in the overall process, and here’s why:
Although plenty of case studies prove that pop-ups can be incredibly effective, consumers don’t always like seeing them.

The reason?

A lot of the pop-ups they come across don’t have very compelling offers. If a pop-up doesn’t effectively entice or motivate a website visitor, it’s just creating noise. A bad user-experience. Bad pop-ups are annoying. And the worst thing you can do in ecommerce is leave first-time visitors feeling annoyed within seconds of landing on your website.

Contrary to what some might say or write, pop-ups aren’t the problem. The problem relates to the offer being presented. If your offer is good enough, your visitors will find value in your pop-up.
So what does an irresistible offer look like in a pop-up? Here are some common traits:

  • Irresistible offers always include a promise. You ask your visitors for information, and you promise them something in exchange for giving you that information.
  • Irresistible offers always create a sense of urgency. They present visitors with something special (a resource, a coupon, a special deal) that they can’t get anywhere else at any other time.
  • Irresistible offers always induce a sense of belonging. They make visitors feel like they are getting access to something that the average person doesn’t get.
  • Irresistible offers always focus on value. They help visitors realize the cost savings they can get access to if they choose to participate.

A popup featuring an irresistible discount on Kate Spade

Example from Kate Spade

To land on the right irresistible offer for your website, put yourselves in the shoes of your customers. Who are they? What motivates them? What are their problems? What can you offer them that your competitors aren’t? Answering these questions will help you land on the right offer for your pop-up.

Step 2: Use Compelling Imagery

When pop-ups look ugly, tacky, or forced, they don’t convert. Online consumers see A LOT of pop-ups every day. They can quickly and easily recognize the bad ones.
In general, pop-ups that fall into the bad or ugly category usually:

  • Aren’t customized.
  • Don’t fit with the look and feel of the website.
  • Use tacky fonts or stock photos.
  • Use spammy or salesy language.
  • Don’t function well with the site.

There are plenty of examples of bad and ugly pop-ups around the web. To see a few examples, check out this blog post from LemonStand, or this post from The Next Web.

To build an effective pop-up, focus first on utilizing the right imagery. As you saw above, your pop-up should fit with the look and feel of your website. It shouldn’t feel forced or out-of-place. The imagery you ultimately use in your pop-up should align with the imagery you use on your product pages and across your shop as a whole.

Compelling imagery might mean including:

  • Images of your products
  • Images of the type of person who might use your products
  • Images of your product packaging
  • Logo and branding graphics
  • Branding colors and font styles

An exit popup on featuring a strong headline

Example from Casper

Your pop-up should appear as an extension of your website—it shouldn’t make visitors feel like they’re looking at an advertising banner or billboard. Remember: the key is to focus on illustrating value.

Step 3: Leverage Conversion-Driven Copy

The purpose of your pop-up is to get the people who see it to take action. Your pop-up can look beautiful and function perfectly on your site, but unless it motivates visitors to actually do something, it’s worthless. Conversion-driven copy can help ensure you’re getting the right message across to everyone who sees your pop-up.

In one of my previous blog posts, I wrote a lot about how to use copy to persuade visitors to take action and ultimately convert. I focused on a handful of specific psychology-backed tips, including:

  • Using copy to create a sense of urgency
  • Using copy to create fear and loss aversion
  • Adding personalization
  • Using sensory words
  • Overcoming objections with risk aversion
  • Connecting to visitors through storytelling

If you’re interested in learning how to make your pop-up copy more effective, I strongly encourage you to bookmark the post, titled 12 Psychology-Backed Copywriting Tips for Boosting Ecommerce Conversions, now and read it next.

Step 4: Incorporate Social Proof

Social proof statements can also make visitors more likely to act when incorporated into pop-ups. When it comes to buying online, consumers want to buy products from companies that other people trust and like already. That’s why reviews, ratings, and user-generated content (like Instagram photos from real customers on product pages) are all found on nearly every popular and profitable ecommerce site you land on today.

Online shoppers don’t just want to read about how great you think your products are—they want to hear from other people to.

There are a number of types of social proof statements you can incorporate into your pop-ups to make them more effective in the long-run. Here are a few ideas:

  • A short quote from a happy customer
  • A 5-star rating with a customer name attached to it
  • A photo of a real customer using and enjoying your product
  • A statement about the number of customers who have purchased your products
  • A statement about the number of products you have sold to customers
  • Social media postings from customers (like a tweet or an Instagram comment)

Your goal here is to make your visitors feel like someone else has already vetted your company for them. They want to feel absolutely sure that you are a reputable company, that your products are as advertised, and that people actually like them.
To learn more about the psychology behind social proof, read any of these great blog posts:

Step 5: Think About Timing and Display

After you have most of the bones of your pop-up created and ready (the copy, the imagery, the offer), your next step is to start thinking about what you want visitors to see and experience when your pop-up displays on their computer or smartphone screen. 

To boost effectiveness, you should think about when you want your pop-up to appear, and how you want it to look to visitors when they land on your website.
Timing is important when it comes to building effective pop-ups. Your timing should align closely with the purpose and goal of your pop-up. Here are two examples of time playing a role in pop-ups:

A popup displayed on

Example from Taft

In this first example, the pop-up is intended to catch website visitors within a few seconds of them landing on the website for the first time. The goal is to entice them with an irresistible offer in exchange for providing them with an email address.

A cart abandonment popup

Example from one of our previous blog posts on building effective exit intent pop-ups

In this second example, the pop-up is intended to prevent visitors from leaving before purchasing. The goal here is to present them with perceived added value that will only be available to them for a limited amount of time.

With Wisepops, you can also display after a certain amount of pages have been viewed, after a certain percentage of a page has been scrolled through, after a certain amount of days, when a visitor clicks a specific link, or when they hover over an element on a page.

You can also boost effectiveness by deciding how you want your pop-up to appear when it loads on one of the pages on your website. With most tools, you can adjust the size and position of your pop-up and test which placement gets the most engagement from your visitors.

Step 6: Customize Based on Audience and Location

In the last few years, segmentation and personalization have slowly become an important part of pop-up optimization. Again, it goes back to the fact that most online consumers see A LOT of pop-ups as they navigate around the web each week. To increase the likelihood that they will act when they see your pop-up, you need to make it meaningful and specific to them. That means doing away with inserting the same pop-up on every page on your website. Instead, you should be creating custom pop-ups for different audiences that land on your pages based on where they come from, and custom pop-ups based on the pages themselves. 

“The biggest factor is contextual relevance,” says Devesh Khanal, CRO Expert and Founder at Growth Rock. “If you can customize the popup to the content on the page, it will generally Convert a lot better than a generic one. Most people think, “well that sounds hard,” but really they only have a handful of high traffic pages. So you can and should spend the time making custom pop-up calls to action for them. It’ll pay off.”

The goal with segmentation and audience targeting is to create seamless, frictionless, personalized experience for people as they travel from external sources (like Facebook or a specific email) to specific pages on your website.

Step 7: Build a Second Version

When you’ve finally gotten to the point where you’re ready to launch your pop-up, you should go back and build a second version. A/B testing your pop-up is an easy way to boost effectiveness and understand what resonates with your audience most. When you’re building a second version of your pop-up, you should think about testing things like:

  • Headline copy
  • Images
  • CTA button copy
  • CTA button size
  • CTA button color
  • Size and placement of pop-up on the page
  • Timing of pop-up
  • Social proof components
  • Urgency/scarcity statements

Most pop-up tools make it incredibly easy to build and launch B versions alongside your original pop-up.

Step 8: Measure, Evaluate, Adapt

When your pop-ups are finally live, your ongoing job is to measure and evaluate their effectiveness, and make adjustments over time based on the results you’re seeing. As you can imagine, measuring success becomes a lot easier when you’re A/B testing your pop-ups. To track performance over time, you should be paying attention to metrics such as emails collection, CTR, displays, and actual conversions.

If you launch a pop-up and you’re not meeting the goals you set or the numbers you thought you’d hit, consider launching a new version of your pop-up to see if you can drive better results. Think again about all the components that can be tested and changed that you read about in the a/b testing section above. Your ultimate goal is to understand what it is that drives your audience to act and engage in a positive way whenever they see a pop-up on your website.

Over to You

What do you think makes a pop-up effective? Tell me in the comments below, I’d love to hear from you.

Rob Wormley Rob is a Content Marketing & Product Marketing Consultant.

Lastest posts