Version1.1.1
Requires WP5.8
Tested up to6.8
Slugcustom-cart-progress-bar-with-milestones-for-woocommerce
Changelog
  • Initial release
  • You can use the shortcode [cart_progress_bar] to display the progress bar anywhere in your cart page, posts, pages, or widgets. Perfect for block based themes!
  • Fixed Milestone Position Issue
  • Problem: When the delivery target value was set lower than the gift target value (e.g., Gift €100, Delivery €50), the icons would position incorrectly, with the gift icon appearing beyond the visible progress bar.
  • Fixed Ajax Cart issue for Block Based Themes
  • Icons filling when a goal is reached + VAT option
  • Added Center first milestone icon functionality - If enabled, the first (lower value) milestone icon is shown at the center of the bar. The bar fill is remapped so the icon is reached exactly at that milestone.
  • Compatibility with Minimog Theme
  • Added Filter for Customization
Custom Cart Progress Bar with Milestones for WooCommerce

Custom Cart Progress Bar with Milestones for WooCommerce

The WooCommerce Custom Cart Progress Bar with Milestones adds an interactive progress bar to the cart and mini-cart, enhancing the shopping experience. Below are simple instructions for setting up and using the plugin to increase customer engagement and order values.

15.00

Lifetime License + Lifetime Updates

14-day money-back guarantee
Pay securely with Visa Mastercard American Express Discover Klarna Revolut Pay

Want more than one plugin? Your discount is applied automatically in the cart:

  • With 2 premium plugins in your cart → 10% off both

  • With 3 premium plugins15% off all of them

  • With 4 or more premium plugins20% off your plugins

Free plugins do not count towards the bundle and are not discounted.
The discount is applied automatically in the cart and at checkout, no coupon needed.

Do you think something is missing from this plugin?

Request a feature

Need a different customization on your website?

Submit a customization request

Custom Cart Progress Bar with Milestones for WooCommerce is a premium plugin that upgrades your cart UX with a sleek, real-time progress bar and milestone rewards. Motivate customers to unlock a Free Gift and Free Delivery by showing clear visual goals, dynamic remaining amounts, and icons that light up when achieved. Built for modern WooCommerce stores, including Blocks carts, and designed to increase average order value without annoying your customers.

Key Features

Dual Milestone System

  • Two goals: Free Gift + Free Delivery
  • Enable/disable each goal independently
  • Automatic milestone ordering (lowest target first)
  • Flexible targets for any store strategy

Smart Subtotal Logic (VAT Option)

  • Progress based on cart subtotal (shipping excluded)
  • New: Option to include VAT/Tax in progress calculation
  • Perfect for stores that display targets “with VAT”
  • Accurate remaining amounts in every phase

Multi-Phase Color Progress

  • Base color before reaching any milestone
  • Automatic color switch after first milestone
  • Final color after second milestone
  • 3 separate color pickers in settings

Milestone Icons that “Fill” When Reached

  • New: Icon circles fill with milestone color on success
  • Clear visual “reward unlocked” feedback
  • Custom icons for Gift and Delivery
  • Labels under icons are fully editable

Real-Time AJAX Updates Everywhere

  • Instant refresh on add/remove/qty changes
  • Cart page + mini-cart/sidebar support
  • WooCommerce Blocks compatible via store listeners
  • Mini-cart fragments supported for smooth UX

Flexible Placement (Auto Insert + Shortcodes)

  • Auto-display in Cart & Mini Cart
  • Disable auto insert and place manually via shortcode
  • Main shortcode: [cart_progress_bar]
  • Aliases: [ccpb] / [progress_bar]

Multilingual Ready

  • Full WPML compatibility
  • Polylang integration
  • Automatic string registration
  • All labels & messages are translatable

License-Protected Updates & Features

  • New: Built-in VGDEV license system
  • Settings and updates unlock after activation
  • Safe, multi-plugin namespaced licensing
  • Automatic update checks every few hours

Setup Instructions

  1. Install & Activate + License

    After purchase:

    • Upload the plugin folder to /wp-content/plugins/
    • Activate via Plugins in WordPress
    • Go to VGDEVsolutions → Cart Progress Bar
    • Activate your license to unlock settings & updates
  2. Open WooCommerce Settings Tab

    All configuration lives inside WooCommerce:

    • Navigate to WooCommerce → Settings → Cart Progress Bar
    • The tab is always visible, but settings are available only with an active license
  3. Configure Milestones

    Choose how your milestones work:

    Enable Milestones:
    • Enable Gift Milestone: Turn free gift goal on/off
    • Enable Delivery Milestone: Turn free delivery goal on/off
    • Gift Target Value: Minimum subtotal for gift (e.g., €50)
    • Delivery Target Value: Minimum subtotal for free delivery (e.g., €100)
    VAT / Tax Mode:
    • Include VAT/Tax in subtotal: Progress = subtotal + VAT (shipping excluded)
    • Leave it OFF if your targets are “without VAT”
    Messages & Labels:
    • Free Gift Message: Text shown after first milestone
    • Free Delivery Message: Text shown after second milestone
    • Remaining Amount Message: Used before milestones
    • Use the %s placeholder for remaining amounts
    Visual Customization:
    • Base Color: Before any milestone is reached
    • Gift Reached Color: After Gift → until Delivery
    • Delivery Reached Color: After Delivery milestone
    • Icon URLs: Upload icons to Media Library → paste URLs
    • Gift/Delivery Text: Labels under each icon
  4. Placement Options

    You decide where it appears:

    • Auto Insert ON: Shows automatically in Cart & Mini Cart
    • Auto Insert OFF: Use shortcode anywhere you want
    • Shortcode example: [cart_progress_bar]
  5. Save & Test

    Click Save Changes and test:

    • Add products and watch progress update instantly
    • Try removing items to see remaining amounts recalc live
    • Check cart page and mini-cart/sidebar cart
    • Test both VAT ON and VAT OFF modes

How It Works

Customer Adds Products:

  1. Progress bar appears with current subtotal progress
  2. Message shows remaining amount to next milestone
  3. Icons are pinned exactly on milestone positions

Reaching First Milestone:

  1. Bar color switches to the first milestone color
  2. Gift or Delivery icon fills to show success
  3. Message updates with next goal remaining amount
  4. Customer gets a clear push to keep shopping

Reaching Second Milestone:

  1. Progress fills to completion
  2. Final milestone icon fills + label highlights
  3. Success message confirms unlocked rewards

Real-Time Updates:

  • AJAX refresh triggers on cart events and fragments
  • Blocks cart listener keeps it synced in modern themes
  • No reloads, no flicker, no lag

Why Choose Cart Progress Bar?

  • Increase Average Order Value — customers naturally chase visible goals
  • Reduce Cart Abandonment — progress creates commitment
  • WooCommerce Blocks Ready — works on classic + modern carts
  • Zero Code Required — everything from settings
  • VAT-Aware Targets — optional tax-inclusive progress mode
  • Beautiful Milestone Feedback — icons fill when achieved
  • Brand-Perfect Styling — full color + icon control
  • Multilingual Support — WPML/Polylang friendly
  • Shortcode Flexibility — place anywhere you want
  • Optimized for Mobile — responsive out of the box

System Requirements

  • WordPress 5.0 or higher
  • WooCommerce 6.0 or higher (tested up to latest version)
  • PHP 7.4 or higher
  • jQuery enabled (standard WordPress)

FAQ

Does it work with WooCommerce Blocks cart / mini cart?

Yes. The plugin listens to WooCommerce Blocks cart store updates and refreshes progress instantly, so it stays accurate in block-based themes.

Can I calculate progress with VAT included?

Absolutely. Enable “Include VAT/Tax in subtotal calculation” and the progress will use subtotal + tax (shipping excluded). Turn it off if your targets are VAT-free.

What happens if I disable Auto Insert?

The bar won’t appear automatically in Cart/Mini Cart. You can place it manually anywhere using [cart_progress_bar] (or the aliases) without double rendering.

Are the texts translatable?

Yes. All messages and labels are registered dynamically and can be translated through WPML or Polylang.

Is a license required?

Yes. An active license unlocks settings and automatic updates. Without activation, the plugin stays inactive to protect premium features.

Start Increasing Your Sales Today

The Custom Cart Progress Bar plugin includes lifetime updates and dedicated support. Turn your cart into a goal-driven sales booster that feels rewarding, not pushy.

Questions

Can I use only one milestone instead of two?

Absolutely! You can enable or disable each milestone independently. Simply check or uncheck the "Enable Gift Milestone" or "Enable Delivery Milestone" options in the settings. This gives you complete flexibility to run promotions with just free gifts, just free delivery, or both together.

Does this work with WooCommerce Blocks (Cart and Checkout blocks)?

Yes! The plugin is fully compatible with WooCommerce Blocks. It includes AJAX functionality that listens to cart changes in block-based carts and updates the progress bar in real-time without page refreshes. You can also use the [cart_progress_bar] shortcode to manually place the progress bar anywhere in your block-based cart page.

How do I add custom icons for the milestones?

Upload your custom icon images to your WordPress Media Library, then copy the image URL and paste it into the "Gift Icon URL" or "Delivery Icon URL" fields in the plugin settings. The icons should be small square images (recommended 30x30px or 50x50px) in PNG or SVG format for best results.

Is the plugin compatible with multilingual sites (WPML/Polylang)?

Yes! The plugin is fully multilingual-ready. All custom messages, labels, and text are automatically registered with WPML and Polylang for translation. Your progress bar messages will display in the appropriate language based on your customer's language selection.

Does the progress bar calculate shipping costs or just product subtotal?

The progress bar is based on the cart subtotal only (products and their quantities), excluding shipping costs. This is the standard WooCommerce approach and ensures customers know exactly how much more they need to spend in products to reach the milestones. Shipping is typically calculated later in the checkout process.

Reviews

{{ reviewsTotal }}{{ options.labels.singularReviewCountLabel }}
{{ reviewsTotal }}{{ options.labels.pluralReviewCountLabel }}
{{ options.labels.newReviewButton }}
{{ userData.canReview.message }}
Custom Cart Progress Bar with Milestones for WooCommerce 15.00 Buy Now