How to Create a Dynamic Free Shipping Banner on Your Shopify Store with Digioh

The free shipping banner lets you display a dynamic message inside a Digioh Campaign that updates in real time as a shopper adds items to their cart. The Shopify Cart Targeting and Personalization extension automatically calculates how much more the shopper needs to spend to qualify for free shipping and exposes that value as a merge tag you can place anywhere in your Campaign copy.

For example, you can show:

“You're only $25 away from FREE shipping on your order of $50+!”

Once they pass the threshold, the message can change to something like:

“You’ve unlocked FREE shipping!”

Prerequisites

• The Digioh JavaScript snippet must be active on your Shopify store.

Step 1: Install the Extension

1. 1. In your Digioh account, navigate to the top-right dropdown and click Extensions.
   2. Go to the Display Rules section, install the Shopify Cart Targeting and Personalization
   3. Once installed, make sure to click Publish to Your Site for the extension to start running.

Step 2: Set the Free Shipping Threshold

You need to tell Digioh what your free shipping threshold is. This is done once using an account-level metadata key.

1. Click your account name in the top-right corner of Digioh and select Account Metadata from the dropdown.
2. Add a new metadata entry: Key: free_shipping Value: Your free shipping threshold as a plain dollar number, for example 75 or 75.00. Do not include a currency symbol.
3. Click Save.

Step 3: Add the Merge Tags to Your Campaign

Once the free_shipping metadata key is configured, two merge tags become available for use in your Campaign copy:

• In the Campaign Builder, open the text element where you want the banner message to appear.
• Add [FREE_SHIP_NET] and/or [FREE_SHIP] to your copy. For example:

Add [FREE_SHIP_NET] for FREE SHIPPING on purchases over [FREE_SHIP]!

Step 4: Configure When the Banner Appears

Add a display rule so the banner only shows to shoppers who have not yet reached the free shipping threshold.

1. In the Campaign Builder, navigate to the Display Rules tab.
2. Add a rule: select Free Shipping Remaining from the Shopify Cart dropdown, set the operator to greater than, and enter 0.
3. Optionally, add a page rule to restrict the banner to product pages, the cart page, or leave it sitewide.
4. Save and publish your Campaign.

Step 5: Go Live

We recommend testing the banner on your live store before publishing. Add different products to your cart and confirm the merge tag values update in real time as your cart total changes. Verify the banner disappears once the cart total exceeds the threshold.

1. Confirm the Campaign is toggled on in your Campaign list.
2. Click Publish.

How It Works

On each page load, the extension reads the shopper's current cart total and subtracts it from the free_shipping threshold. The result is exposed as the Free Shipping Remaining display rule property and as the [FREE_SHIP_NET] merge tag. Both update automatically whenever the cart changes.

Related Articles

• Shopify Cart Targeting and Personalization: Extension Overview
• Campaign Targeting Using Shopify Cart Display Rules
• Displaying a Cart Item Dynamically Inside a Campaign