Display Shopify Discount Codes on Storefront Pages
In 2017 Shopify introduced “Shareable Discount Links” which is a great way to distribute discount codes to your clients via email, vouchers, printed QR codes, etc.
Shareable discount links are standard web links using a special format. Once a client clicks on the link he comes directly to your online store. The discount code is applied automatically so he does not have to enter the code during checkout.
Figure 1 shows the Shopify admin page after the discount code PROMO18 has been created. When you click the “Get shareable link” button you can copy the shareable discount link and use if for your promotions. The link has the following format: https://www.myshop.com/discount/PROMO18.
In this article I use www.myshop.com as example shop domain. Replace the links with your real shop domain.
When a discount code is applied through such a link I want to display the code for instance on the shopping cart page (see figure 2).
Unfortunately the official Shopify API does not offer a way to access to the applied discount code on storefront pages.
- New Discount Link: https://www.myshop.com/?discount=PROMO18
Get the discount parameter from the URL
Store the discount code in the browser’s sessionStorage
Redirect to https://www.myshop.com/discount/PROMO18
- Shopify Discount Link: https://www.myshop.com/discount/PROMO18
Shopify stores the discount code in their session environment
Redirect back to https://www.myshop.com/
This snippet adds the discount code to the sessionStorage and redirects to the standard Shopify discount link.
You can verify that the code is added correctly to the sessionStorage using the Chrome DevTools.
Access Discount Code from sessionStorage:
In the basket section of my theme which is embedded in the cart page I use the following form to proceed to checkout:
This creates the shopping cart including the discount input box you can see on the right image in figure 2.
Please be aware that this is just a workaround. It adds an extra redirect when entering the new promotion link and the browser sessionStorage is not in sync with the Shopify session environment. Anyway I use this solution for quite some time now without any complaints.