Want to nudge your customers toward the free shipping threshold? The Free Shipping Progress Bar module in Botiga Pro displays a visual progress bar in the cart, mini cart, and checkout that shows shoppers how close they are to qualifying for free delivery.
In this guide, we’ll walk you through how to set up and customize the Free Shipping Progress Bar in Botiga Pro.
Before you get started, make sure you’ve installed and activated the Botiga theme on your WordPress site. If you’re using features from Botiga Pro, ensure that both the Botiga theme and the Botiga Pro plugin are installed and active. This feature requires Botiga Pro.
Important: For the progress bar to work, your WooCommerce store must have the Free Shipping method enabled with the Minimum Order Amount option configured. We’ll cover that setup below.
1. Enabling the Free Shipping Method in Your Store
From your WordPress admin, go to WooCommerce >> Settings >> Shipping and add a new shipping zone.
In the shipping zone settings, enter the zone name and regions, then click Add shipping method.
Select Free shipping and click Add shipping method to confirm.
2. Configuring the Free Shipping Method
Next, you need to create a rule that defines when free shipping kicks in. Click Edit below the Free shipping method.
From the Free shipping requires dropdown, select A minimum order amount. Two new fields will appear. Enter your Minimum order amount and save the changes.
3. Activating the Free Shipping Progress Bar Module
In your WordPress admin, go to Appearance >> Theme Dashboard >> Theme Features and activate the Free Shipping Progress Bar module.
Once activated, the progress bar will automatically display in the cart, mini cart, and checkout pages on your Botiga Pro WooCommerce store.
4. Customizing the Free Shipping Progress Bar
To customize the look and behavior of the progress bar, click the Customize button inside the Free Shipping Progress Bar module on the Theme Features page.
General Options
- Display On: Choose which pages the progress bar appears on.
- Include Tax In Calculation: When enabled, WooCommerce tax counts toward the free shipping threshold.
Style Options
- Text Color: Sets the color of the text inside the progress bar.
- Progress Bar Wrapper Background Color: Sets the background color of the wrapper around the progress bar.
- Progress Bar Background Color: Sets the background color of the progress bar itself.
- Progress Bar Height: Sets the height of the progress bar in pixels.
- Border Radius: Sets the border radius of the progress bar in pixels.
Frequently Asked Questions
Below, we’ve answered some of the most common questions about the Free Shipping Progress Bar in Botiga Pro.
Why isn’t my progress bar showing up?
The progress bar won’t appear unless WooCommerce has a Free Shipping method with a Minimum order amount configured. Double-check your shipping zone settings under WooCommerce >> Settings >> Shipping.
Can I show the progress bar on product pages?
By default, the bar appears in the cart, mini cart, and checkout. Use the Display On option in the module settings to control exactly where it shows.
Does my progress bar include tax in its calculation?
Only if you enable the Include Tax In Calculation option. With it off, the bar measures progress against the pre-tax subtotal.
Can I have different thresholds for different regions?
Yes. Each shipping zone in WooCommerce can have its own Free Shipping method and minimum order amount. The progress bar reflects the threshold that applies to the customer’s location.
That’s it! You’ve successfully set up and customized the Free Shipping Progress Bar in Botiga Pro.
Next, would you like to encourage more upsells in the cart? Check out our guide on add to cart notifications in Botiga Pro to learn more.
