Coupon Support for BigCommerce

When you send your customers a coupon, you want to make sure that it's as easy for them to use as possible. By adding a small script to your BigCommerce theme and using our built-in "checkout with coupon" tag, you can now easily let your customers auto-apply the coupon codes they receive from you via email.

Setting up BigCommerce

For this to work, you need to do a little bit of setup on the BigCommerce side. You only need to do this once. These instructions were inspired by the blog post by Emilian at Spring Merchant.

1. In your BigCommerce admin area, navigate to "Storefront Design -> My Themes -> Edit HTML & CSS"

2. Find the file Panels / Footer.html and add the following code (see example):

<script type="text/javascript " src="https://d3ryumxhbd2uw7.cloudfront.net/bigcommerce/rmBcUtils.js"></script>

3. Under "Other Template Files", find Panels/CartCouponCodeBox.html file, and add the following script at the bottom(see example):

<script type="text/javascript">
$(document).ready(function() {
if ("%%GLOBAL_CouponId%%" == "") // No existing coupon
rmBcUtils && rmBcUtils.applySavedCoupon();
else
rmBcUtils && rmBcUtils.clearSessionCoupon();
});
</script>​

4. In the same file (Panels/CartCouponCodeBox.html), find the code for the "submit" button which looks like this:

<input type="submit" value="Go" class="btn" />

and change it to this:

<input type="submit" value="Go" class="btn couponcodeSubmitBtn" />

5. Save the changes

Testing your BigCommerce Configuration

To make sure that the theme is setup correctly, create a coupon code in BigCommerce and call it "REMARKETY_TEST". Then, browse to your store using the following URL:

https://<your-store-url>?coupon=REMARKETY_TEST

Add an item to the cart, and go to the checkout page - you should see a brief refresh, and the code will be auto-applied to your cart. 

Using a coupon checkout code in your emails

1. Set up a coupon for use in your campaigns, in the Setup tab. For example:

Selection_992.jpg

2. In the Design tab, you will now be able to use the following link, which will take users to the cart page, which their coupon auto-applied: {$coupon.checkoutUrl}. For example:

Selection_994.jpg

3. That's it!

 

Have more questions? Submit a request

0 Comments

Please sign in to leave a comment.