Offer discount coupons on Shopify product pages

Offer discount coupons on Shopify product pages
Nina De la Cruz
Nina De la Cruz 4 min read
💥 Join 5K subscribers

Nothing encourages customers to make a purchase more than discounts. But what’s the most efficient way to offer a discount coupon?

A lot of Shopify store owners will say it’s popups.

In this quick guide, we’ll show you how to display a discount coupon on Shopify and allow customers to apply it upon button click. You’ll be able to place special offers sitewide or on selected product pages based on various conditions, such as:

  • product vendor
  • cart total amount
  • number of items in the cart
  • and many more!

To offer a discount, you can use Getsitecontrol sticky bars, slide-ins, or modal popups like this one:

Once a customer hits the button, the discount coupon will be automatically applied to their cart and the popup will close.

Want to implement this scenario in your store? Below, we’ll show you how to do that.

Before you get started, you’ll need to install Getsitecontrol on your website. Find Getsitecontrol in the Shopify app store and hit Install to start your free trial. Then follow the steps from the guide below.

Step 1. Select a popup template

Once you open your Getsitecontrol dashboard, hit Create widget, and proceed to See template gallery. In the gallery, open the Ecommerce section and pick the template you like the most.

Getsitecontrol popup template gallery for Ecommerce

Click on a template to see it in action. To use it on your website, select Create widget on the right-hand side when prompted.

Step 2. Type your copy

In the Content tab, you can change the offer description and the text on the action button. To do that, use the menu on the right-hand side: click on the text fields you want to change and type in the details.

How to create a discount offer popup in Getsitecontrol dashboard

Your goal is to let customers apply the automatic discount coupon upon a button click, right?

To implement that, you need to create a discount code URL in your Shopify dashboard and assign it to the button on the popup.

That’s quite easy! For starters, open your Shopify dashboard and go to Discounts:

How to create a discount coupon in Shopify dashboard

Create a new coupon or use an existing one. In our case, the name of the coupon is OFF10.

Next, use the Promote dropdown menu and get a shareable link to the discount you’ve just created.

How to copy a direct link to discount coupon in Shopify dashboard

The link will look something like that:

Now, if you’ve been using Shopify for some time, you probably know that when a customer uses such a link, they will be redirected to the homepage of your store. It’s not too convenient, but that’s just how Shopify works. Luckily, we have a solution!

To prevent that from happening, you need to expand the discount URL by adding this piece:


It will ensure that your customer stays on the same page and doesn’t get redirected after applying the coupon.

As a result, this is what your link should look like:{{$location_fullpath}}

Again, the first part of the URL is the discount link you generated in your Shopify dashboard. The second part of the URL is the add-on to keep customers on the same product page where the offer has popped up.

Once the discount link is ready, you need to add it to the button settings in the Getsitecontrol dashboard. To open the button settings, click on the button text on the right-hand side menu and find Action:

Set your Shopify discount coupon to be applied to cart upon button click

Then, select the Add action menu and pick Open URL, then paste the URL you’ve just generated. Change the text on the button if needed, too.

Now, when your customers click the button, the coupon will be applied to the cart whether it contains items or not.

Step 4. Decide where and when to show the discount coupon

The Targeting tab gives you full control of who will see the discount offer. By default, the popup will be displayed on every page of your store – that’s what your full web address in the Include field means.

How to set conditions and display a popup on selected Shopify product pages

To set the conditions for when to display the coupon, find Show widget to visitors if control and add the desired filter.

In the example above, we chose to display the discount coupon on product pages associated with a particular vendor. Other options include:

  • Total cart price
  • Number of items in the cart
  • Discount applied to the cart
  • Types of products
  • Product tags or ID
  • Whether a customer is logged in
  • Amount spent by the customer
  • Variant ID or price

The list of conditions for displaying discount coupon on Shopify product pages with Getsitecontrol

Lastly, scroll down a bit and find the Stop to display the widget option. Open the menu and select Submission. This means that the coupon will stop popping up after the customer hits the button and applies the discount. You can stop displaying the widget forever or for some time: hours or days.

You may also want to add the rule for when to start displaying the widget: at once, after a customer has spent a couple of seconds or scrolled down the page, right before they exit the page – or other conditions.

As soon as you set all the parameters, you can save and activate the widget. It will instantly go live in your store.

Got any questions? Feel free to shoot us an email at

You’re reading Getsitecontrol usecase collection where we talk about the best practices for using website popups. This usecase is a part of Grow on Shopify section.

Get the print version

Download a PDF version of our use case for easier offline reading and sharing with coworkers.

Download PDF

Best practices

You’re reading Getsitecontrol usecase collection where we talk about the best practices for using website popups. This usecase is a part of Grow on Shopify section.

Subscribe to get updates

Get beginner-friendly tips for growing your online business.

Join the list →