Cart Drawer Design & Layout
Cart behavior settings
Control how the cart drawer opens, closes, and animates.
This article is a draft and may be incomplete or change before publishing.
Cart behavior controls how the drawer opens, closes, and animates on your storefront. Open Cart Editor → Behavior.
Slide direction
Choose where the drawer slides in from:
- Right (default) — Most common, feels natural on desktop.
- Left — Useful if your theme has a right-side floating element.
- Bottom — Feels native on mobile and modern on desktop.
Auto-open on add-to-cart
Recommended ON. Customers see their cart and any unlocked rewards immediately after adding a product. Disabling this hurts conversion.
Click outside (overlay) to close
Recommended ON. Standard expected behavior on every modern site.
ESC to close
Desktop only. Recommended ON for accessibility.
Lock page scroll
Recommended ON. Prevents the page behind the drawer from scrolling, which feels broken to most shoppers.
Animation speed
250ms is the default. Faster (100–150ms) feels snappier; slower (350–400ms) feels premium but can read as sluggish on mobile.