How to Create an Average Cart Value Booster

Lisa Fockens Updated by Lisa Fockens

In this guide, I’m going to show you how to create a cart value booster based on your free shipping threshold.

Note: This tutorial will only work if:

  • You're able to set the cart total price as a custom property - this is done out of the box when using our Shopify app
  • You have a free shipping threshold (this is probably obvious)

Step 1 (non Shopify):

If you're using our Shopify app, you can skip this step.

You must let Wisepops know what is the total price in the cart. So we can do some math on it. In your website source code, define a custom property just after our setup code. Like this:

wisepops('properties', {cart: {
total_price: REPLACE_WITH_CART_PRICE
}});

REPLACE_WITH_CART_PRICE must be replaced by the actual price of the cart.

Step 2:

Create a new campaign in your Wisepops account.

Step 3:

Drag and drop a text block into your popup.

Step 4:

Copy and paste the following piece of code into your block:

{{ X | minus: cart.total_price | round: 2 }}

Replace the X with your own free shipping threshold. For example:

{{ 20 | minus: cart.total_price | round: 2 }}

When the popup is displayed, this section will be replaced with the value that your visitor needs to add to his cart to get free shipping.

Step 4:

Add the text around the dynamic block.

Your should end up with something like this:

Step 5:

In Display > Pages, create a following rule to ensure that the campaign is displayed only on the cart overview page:

Step 6:

In Display > Ecommerce (or Display > Custom Properties), add the following rule (replace 100 with your own free shipping threshold):

If cart.total_price isn't present in the dropdown, you can type it manually.

And you’re done!

Here’s what the final result looks like on our own store (hope you don’t mind the Pokemon):

How did we do?

Add Wisepops with Google Tag Manager

Add Wisepops to Zoey

Contact