Canonical URL: https://chargezen.com/docs/checkoutos/checkout-extensions/shipping-bar

# Shipping Progress Bar

Encourage larger orders by showing progress toward free shipping

Last updated: 2025-01-16

The **Shipping Progress Bar** displays how close a customer is to qualifying for free shipping (or other thresholds). This visual motivator is highly effective at increasing average order value by encouraging customers to add more items.

##### AOV Impact

Merchants using shipping progress bars typically see an **8-15% increase in AOV**as customers add items to reach the free shipping threshold.

## How It Works

The progress bar updates in real-time as items are added to the cart:

*   **Below threshold** — Shows amount needed: "Add $15 more for FREE shipping!"
*   **At threshold** — Celebrates success: "You've unlocked FREE shipping!"
*   **Animation** — Smooth progress animation as cart updates
*   **Persistence** — Appears throughout checkout to reinforce the message

## Basic Configuration

Shipping Bar Configuration

```json
{
  "shipping_bar": {
    "enabled": true,
    "threshold": 75.00,
    "currency": "USD",
    "messages": {
      "below_threshold": "Add {{amount}} more for FREE shipping!",
      "at_threshold": "You've unlocked FREE shipping!",
      "above_threshold": "Congrats! You get FREE shipping!"
    }
  }
}
```

## Setting Up the Progress Bar

1

#### Navigate to Extensions

Go to CheckoutOS → Checkout Extensions → Shipping Progress Bar.

2

#### Set Your Threshold

Enter your free shipping threshold amount (should match your shipping settings).

3

#### Customize Messages

Edit the text that appears at each stage of progress.

4

#### Choose Placement

Select where the bar appears (order summary, top of checkout, etc.).

5

#### Style the Bar

Customize colors, animation, and appearance.

6

#### Preview & Publish

Test with different cart values, then publish.

## Advanced Options

### Tiered Shipping Thresholds

Support multiple shipping tiers with different thresholds:

Tiered Thresholds

```json
{
  "tiers": [
    {
      "threshold": 50,
      "message": "Spend $50 for reduced shipping ($4.99)",
      "shipping_rate": 4.99
    },
    {
      "threshold": 75,
      "message": "Spend $75 for FREE shipping!",
      "shipping_rate": 0
    }
  ],
  "show_all_tiers": true
}
```

### Geographic Thresholds

Set different thresholds based on shipping destination:

Geographic Configuration

```json
{
  "geographic_rules": {
    "US": { "threshold": 75 },
    "CA": { "threshold": 100 },
    "EU": { "threshold": 150 },
    "default": { "threshold": 75 }
  }
}
```

### Product Suggestions

Show product recommendations when customers are close to the threshold:

Product Suggestions

```json
{
  "suggestions": {
    "enabled": true,
    "trigger_distance": 20,
    "max_products": 3,
    "source": "frequently_bought_together",
    "price_range": {
      "min": "{{remaining_amount}}",
      "max": "{{remaining_amount * 1.5}}"
    }
  }
}
```

## Styling Options

Customize the appearance to match your brand:

Styling Configuration

```json
{
  "styling": {
    "bar_color": "#22c55e",
    "bar_background": "#e5e7eb",
    "text_color": "#1f2937",
    "success_color": "#16a34a",
    "height": "8px",
    "border_radius": "4px",
    "animation": "smooth",
    "show_percentage": false,
    "show_icon": true,
    "icon": "truck"
  }
}
```

## Placement Options

#### Available Locations

*   Order summary header — Most visible, recommended
*   Above cart items — Early visibility
*   Below cart items — Near subtotal
*   Sticky banner — Stays visible while scrolling
*   Multiple locations — Reinforce the message

## Best Practices

##### Optimization Tips

*   **Set realistic thresholds** — 15-25% above your average order value
*   **Celebrate success** — Make reaching the threshold feel rewarding
*   **Use urgency wisely** — "Almost there!" messaging is effective
*   **Show product suggestions** — Help customers find items to add
*   **Match shipping settings** — Ensure threshold matches actual free shipping rules

## Tracking Performance

Monitor the impact of your shipping bar in CheckoutOS analytics:

*   **Threshold reach rate** — % of customers who reach free shipping
*   **AOV change** — Before/after comparison
*   **Items added** — Average items added after seeing the bar
*   **Conversion impact** — Overall checkout conversion changes

## Related Extensions

[

### Trust Badges

Add security and trust signals

Learn more



](https://chargezen.com/docs/checkoutos/checkout-extensions/trust-badges)[

### Gift Options

Let customers add gift messages

Learn more



](https://chargezen.com/docs/checkoutos/checkout-extensions/gift-options)

Was this page helpful?

Need more help? [Contact support](https://chargezen.com/docs/checkoutos/troubleshooting/support)