E-commerce Onsite Marketing Tutorials

How to Add a Popup on Shopify

Why add popups to a Shopify store?

It’s simple.

You can achieve a lot of goals, like:

  • Converting up to 10% of traffic
  • Generating more leads
  • Driving traffic to pages with sales

Sounds good? If yes, let’s see how to add a popup on Shopify.

Go to content sections:

What popups are popular on Shopify websites?

The most popular types of Shopify popups are:

If you’d like to make discount popup, here are 18 discount code ideas for you.

How to add a popup to a Shopify store

Follow these steps to create and add a popup to a Shopify store:

  • Add a Shopify popup app
  • Get a free account
  • Create a campaign
  • Choose a goal
  • Select a template
  • Customize popup design
  • Configure display scenario
  • Activate your popup

Step 1: Add a Shopify popup app to your store

In this tutorial, we’ll create a free shipping promo popup.

We’ll use Wisepops—this app has a 5-star rating from Shopify users. Here’s Wisepops on the Shopify App Store.

Once you add Wisepops to your store, it will take you to the registration page.

Step 2: Get a free account

You can register in two ways: with your Google account or email. Choose your preferred way to continue.

signup-page

Add your details to complete the registration and integrate your Shopify store. 

This takes about a minute, so now you can start creating your first Shopify popup campaign to convert your visitors.

Note: You can also add Wisepops to your store with a setup code.

Step 1: Get a free account at the Wisepops website.
Step 2: In Wisepops, go to Settings > Websites, click the three-dot icon next to your store’s URL. 
Step 3: Choose Setup code in the menu that appears to reveal the code.
Step 4: Add the code just before the </body> tag in your store’s theme.
Wisepops setup code example
Need help with adding Wisepops?
Drop our support team a line using the live chat button on the website. Visit our Help Center (this Section on Embedding Wisepops Code should be useful)

Step 3: Create a campaign

Let’s get back to the Wisepops dashboard.

To make a new popup for your Shopify store, click New Campaign > Campaign Assistant.

Wisepopse create new campaign

Step 4: Choose a campaign goal

Time to decide on the goal for our Shopify popup.

Select Drive Sales.

Wisepops campaign goal

Next, Wisepops will show you ways to drive sales: free shipping, first order coupons, time-limited offers, and others.

Choose Free Shipping.

Wisepops select goal

Step 5: Select a popup template

After choosing Free Shipping, you’ll automatically be redirected to the template library. There, you can choose the format for your Shopify popup.

Let’s choose the third template (see below). It’s a non-intrusive website popup that can be displayed in a corner of the screen.

Wisepops select template

Here’s a preview of this template in Wisepops (log in to view).

Step 6: Customize the popup design

Once you’ve chosen a popup template, you’ll be redirected to the campaign editor. 

Let’s make the campaign look like a natural part of your Shopify store. Doing so is simple: just hover over an element to view editing options.

Like here, the options appear when I hover over the popup’s main headline.

Wisepops customise campaign

Customization tips:

  • Add an original image
  • Use your brand colors for design consistency
  • Give the CTA button a contrasting color to make it stand out
  • Add a link to a product page or a product category page in the CTA text menu to lead visitors to purchases

Also, here’s a tip: set a free shipping threshold of $100—65% of customers pay attention to thresholds before adding products to shopping carts.

Want examples of beautiful popups to inspiration?

👉 Shopify Popup Examples
👉 Email Popup Design Examples + Design Tips
👉 Gorgeous Popup Design Examples

Step 7: Configure a popup display scenario

Popup timing plays a deciding role in maximizing conversions.

In this case, we want all visitors to see our Shopify popup. That’s why we might want to show the campaign when they load your store. To set up the timing, go to the Trigger tab in the Display menu.

There, choose On Landing

Wisepops display scenario

Once you’ve set the timing, let’s add a 10-second delay.

This means delaying the display of the popup by 10 seconds. Since the immediate display of popups might be frustrating to some visitors, the delay will let them have a quick look around first.

To add the delay, find the Timing section in the Trigger tab. There, click on After delay.

Wisepops page delay setting

Once you click After delay, you’ll see an entry field and dropbox appear. 

Add “10” to the box and choose Seconds on page in the dropdown menu (just like in the image below). Click +Add rule when you’re done.

Wisepops timing

Now, with the time delay added, your task of creating the campaign is almost done.

Time to save the campaign.

Click Done Editing in the top right corner of the editor.

More info about how popup timing impacts conversions: How to find time to show your offer.

Step 8: Activate your Shopify popup

Go to the dashboard (click on Wisepops logo in the top left corner) and make sure you’re in the Campaigns tab. Click Publish.

The campaign is now live!

Spin-to-Win Popup Tutorial

How about making a popup that generates 5,000 leads monthly? In this Faguo Case Study, find a tutorial to replicate the brand’s most successful spin-to-win popup campaign.
 
Faguo popup example

Learn more about Shopify popups

With Wisepops, you can add just about any popup to your Shopify store. This also means you’ll find plenty of conversion-oriented features, gorgeous popup templates, and pro marketing tips.

From here, we recommend that you explore these options:

The main menu in Wisepops contains plenty of customizations for your popup campaigns. With Popup and Blocks sections, for example, you can create popups of different sizes, formats, layouts, and add different buttons.

Wisepops blocks

Also, our blog is a source of popup tips, success stories, and best practices. These posts should be interesting for Shopify store owners like you:

Last but not least –

Congrats, you did it!

You joined the club of top Shopify stores that convert visitors with popup campaigns.

How to add popups to Shopify: summary

Adding popups to your Shopify store can become your leading onsite marketing and lead generation idea. Create your first campaign, try different methods and incentives for visitors, and watch your business grow like never before.

Give it a go, and you’ll see that Shopify popups make it possible to generate thousands of leads on autopilot.

Caro Cooper Caro has nearly twenty years of experience as a professional writer and editor. She specializes in the fields of tech and ecommerce content. Caro has degrees in Business and Arts, as well as post-graduate qualifications in Editing and Publishing.

Lastest posts