Skip to content
CartPops Docs
Esc
↑↓navigate↵open⌘Jpreview
On this page

Cart drawer settings

Control how the cart drawer looks and behaves, from its position and width to the totals, the checkout button and the text shoppers see.

The cart drawer is the slide-out panel that shows a shopper’s cart. You manage it in one place, and a live preview next to the settings shows each change as you make it.

Where to find it

In wp-admin, go to WooCommerce > CartPops > Drawer. The page has three tabs: Layout, Design and Shipping meter. This guide covers Layout. For colors and presets, see Drawer design. For the shipping meter, see Free shipping progress bar.

Click Save Changes at the top of the page when you are done.

Add the drawer to your site

On every theme, the drawer renders in the page footer automatically. You do not have to add anything.

If you use a block theme and want to control where the drawer markup sits, add the CartPops Cart Drawer block in the Site Editor. A page can only hold one drawer. If a Cart Drawer block is already on the page, CartPops skips the automatic footer drawer and removes any extra Cart Drawer block. The block has no settings of its own. Everything below applies to both.

Position and size

Setting Options Notes
Position Right, Left The side the drawer slides in from.
Width (Desktop) 50 to 1400 px Starts at 480 px.
Width (Mobile %) 50 to 100 Share of the screen width. Starts at 100.

Animation

Setting Options
Animation Type Slide, Fade, None
Duration (ms) 50 to 800. Starts at 300.

Behavior

  • Show undo after item removal: shoppers see an undo option after they remove an item.
  • Show coupon code field: lets shoppers apply coupon codes from the drawer. Turn it off if you don’t use coupons.
  • Product name display: how long product names wrap. Choose Two lines, Single line (cut off with an ellipsis) or Full name.
  • Checkout Button Text: leave empty to use the default, “Proceed to Checkout”.
  • Quantity Selector > Style: None, Default, Rounded or Minimal.

Totals

The drawer can show a breakdown of the cart totals. Choose where it goes with Totals breakdown:

  • In footer (sticky) keeps the totals visible under the items.
  • Above checkout (scrollable) puts them at the end of the scrolling area, above the checkout button.
  • Hidden (total only) shows only the grand total.

Then pick which lines appear: Show subtotal, Show discounts, Show shipping, Show taxes and Show total.

Secondary action

Add an extra link or button below the checkout button. Choose an Action:

  • None adds nothing.
  • Continue shopping is a button that closes the drawer.
  • View cart links to your WooCommerce cart page. When you pick this, CartPops hides its smaller built-in “View cart” link so the same action doesn’t appear twice.
  • Custom URL links to a page you choose. Enter a Custom URL (a path like /offers or a full https:// address) and a Custom text label of up to 80 characters. If either value is invalid, the drawer shows View cart instead.

Customer messages

These fields change the text shoppers read. Leave a field blank to use CartPops’ built-in text, which is already translated for supported languages.

Field Default text
Cart title Your Cart
Added-to-cart announcement Product successfully added to your cart.
Coupon heading None. A coupon heading is hidden unless you add one.
Coupon input placeholder Coupon code
Coupon button text Apply
Subtotal label Subtotal
Discount label Discount
Total label Total
Empty-cart title Your cart is empty
Empty-cart subtitle None. Hidden unless you add one.
Empty-cart button text Continue shopping

The Added-to-cart announcement is read out by screen readers when an item is added. It is not shown on screen. Enter complete plain text, or leave it blank to turn the announcement off.

Was this page helpful?