Side Cart & Order Bumps for WooCommerce

The free, open-source WooCommerce cart drawer plugin. A lightweight slide-in AJAX side cart with a free shipping progress bar, in-drawer coupon codes, in-cart cross-sells and a one-click order bump on the native checkout — a free alternative to FunnelKit Cart and CartFlows ($99–$299/yr) that increases average order value without touching your theme.

Download the latest release · Report an issue

WooCommerce side cart drawer with free shipping progress bar, coupons and cross-sells

Features at a glance

Feature What it does
🛒 Slide-in side cart drawer AJAX mini cart that opens on add-to-cart and syncs through WooCommerce’s own fragment system. Floating button with live item count.
🚚 Free shipping progress bar “Add $12 more for free shipping” nudge with animated bar and success state. Threshold auto-detected or overridden.
🏷 In-drawer coupons Apply and remove coupon codes inside the drawer; WooCommerce core validates limits, expiry and restrictions.
🔗 In-cart cross-sells Cross-sell products with AJAX add-to-cart, shown right in the drawer.
✅ Order bump One discounted offer above the place-order button; toggles the real cart session so totals, taxes and shipping recalculate natively. Percentage or fixed-amount discounts with a “Save X%” badge.
📊 Bump analytics Offers accepted, orders with bump, bump revenue, checkout conversion — stored privately in your own database.
🎨 Customization Left/right drawer position and an accent color picker for the whole cart UI.

Getting started

Installation

  1. Download the latest release or clone this repository.
  2. Zip the folder and upload via Plugins → Add New → Upload (or copy to wp-content/plugins/).
  3. Activate, then open WooCommerce → Side Cart & Bumps.

Requirements: WordPress 6.0+, WooCommerce 7.0+, PHP 7.4+. HPOS (high-performance order storage) is fully supported.

The cart drawer

Mobile full-width cart drawer sheet

Free shipping progress bar

The bar appears inside the drawer and updates with every cart change:

add_filter( 'wscb_free_shipping_threshold', function ( $threshold ) {
    return 150.0; // always show a $150 goal
} );

Coupons in the drawer

Shoppers who leave checkout to hunt for coupon codes rarely come back. With the coupon field enabled, they can try codes immediately — WooCommerce core handles validation, usage limits, expiry and restrictions, and messages render as drawer-local notices:

Coupon code applied inside the cart drawer

Applied coupons appear as chips with a one-click remove (×).

In-cart cross-sells

Assign cross-sells to a product (Product → Product data → Linked Products) and they appear inside the drawer with AJAX add-to-cart buttons for simple products. Only visible, in-stock, purchasable products are shown; hide the section entirely from settings.

The order bump

The bump renders a single checkbox above the Place order button on the classic WooCommerce checkout:

Order bump offer on the native checkout

Setup under Order Bump:

  1. Enable order bump and pick the offer product.
  2. Choose a discount type — Percentage off (0–100%) or Fixed amount off — and the value.
  3. Optionally customize the checkbox label ({product} placeholder supported) and description, then save.

How it works — and why it’s safe:

Note: the bump requires the classic checkout (the [woocommerce_checkout] shortcode). The block-based checkout is not supported yet.

Bump analytics

The settings page shows four counters — offers accepted, orders with bump, bump revenue and checkout conversion — plus a reset button.

Settings screen with bump analytics dashboard

Developer API

A small, documented surface:

Hook Type Description
wscb_free_shipping_threshold PHP filter Filter the progress bar threshold at runtime.
wscb_setting PHP filter Override any setting at read time. Signature: ($value, $key).
wscb_drawer_opened / wscb_drawer_closed JS events on document.body Drawer opened/closed.
wscb_coupon_updated JS event on document.body Fires after coupon apply/remove; first arg is the array of applied codes.
wscb_open_drawer JS event on document.body Open the drawer programmatically.
[data-wscb-open] HTML attribute Click-to-open: add to any link or button. 
// Open the drawer from your own script.
jQuery( document.body ).on( 'wscb_drawer_closed', function () {
    console.log( 'cart drawer closed' );
} );

Custom AJAX endpoints (all wc-ajax, all nonce-protected, guests included): wscb_update_cart_item · wscb_apply_coupon · wscb_remove_coupon · wscb_toggle_bump

Why it’s fast

No build step, no jQuery UI, no bundled libraries, no external requests. The drawer re-renders via woocommerce_add_to_cart_fragments, so it inherits WooCommerce core’s AJAX behavior instead of reimplementing it. Assets are a few kilobytes of plain CSS/JS, versioned by file modification time.

FAQ

Does it work with HPOS (high-performance order storage)? Yes — compatibility is declared explicitly on load.

Which checkout does the order bump support? The classic shortcode checkout. The WooCommerce block checkout is planned.

Can customers change bump quantities? No — bump items are locked at quantity 1 and are toggled with the checkbox, keeping analytics honest.

What happens if the customer removes the bump product elsewhere? The checkbox always mirrors the real cart and renders unchecked on the next load.

Does it create database tables? No — two options rows at most (settings and analytics counters), both removed on uninstall.

Is it translation-ready? Yes — every string is internationalized and a .pot ships in languages/.

Can I use multiple bumps? One well-tested bump per store for now; multiple offers are on the roadmap.

Changelog

See CHANGELOG highlights in readme.txt.

License

GPL-2.0-or-later. Free software, no upsells, no tracking.