Controlling When the Cart Drawer Opens

This article explains what makes the cart drawer open, how to turn off auto-open, and how to trigger the drawer from your own buttons or icons.

What triggers the drawer

Three things can open the drawer:

1. A customer adds a product to the cart.
2. A customer clicks the cart icon.
3. Your theme or a custom script calls the drawer's open function directly.

The drawer never opens just because a customer visits a page. It only opens from one of the three triggers above.

Turning off auto-open on add to cart

1. Go to Essential Cart Drawer → Settings.
2. Uncheck Open cart drawer on add to cart.
3. Save.

Turning this off only stops the automatic pop-up on add to cart. The cart icon and any manual open call still work.

Blocking auto-open on one specific page

There is no admin setting to stop auto-open on a single page. This is handled two ways:

1. A small number of pages are blocked automatically by a list built into the app for your shop. You cannot edit this list.
2. You can block any other page yourself by adding a script to that page.

Blocking a page yourself

1. In your theme, add a Custom HTML block to the page you want to block.
2. Add this script:

window.essentialCartPreventAutoOpenPaths = ['/pages/your-page'];

3. Save the page.

Path matching ignores your store's language prefix, so one entry covers the page across all locales.

This is a workaround, not a setting. There is no built-in per-page toggle in the admin.

Making the header cart icon open the drawer

The cart icon should open the drawer by default. If clicking it takes customers to the cart page instead, check what the icon links to in your theme.

If the icon still doesn't open the drawer

1. Find the cart icon element in your theme code.
2. Add a click handler that calls:

window.essentialCartApi.openCart();

Triggering the drawer from a custom add-to-cart button

Custom add-to-cart buttons on native Liquid sections don't always trigger the drawer on their own. After your button finishes its add-to-cart request, call:

window.essentialCartApi.openCart();

1. Add your add-to-cart logic (form submit or fetch call).
2. After it succeeds, call window.essentialCartApi.openCart() .

Buy Now and dynamic checkout buttons

The Buy Now button sends customers straight to checkout. It cannot be configured to open the cart drawer instead. This is a Shopify checkout behavior, not something the app controls.

Add to cart redirecting to the cart page instead of opening the drawer

This usually has one of these causes:

Setting the theme cart type

1. Open Theme Editor.
2. Go to Theme Settings → Cart.
3. Set Cart type to Drawer.
4. Save.

Setting Cart type to Page will always send customers to the cart page, no matter what this app's settings say.

Two carts showing at once

If both your theme's native drawer and this app's drawer open, disable the theme's native cart pop-up first. This does not always fully resolve the conflict on its own — some themes and apps hook into the same add-to-cart event and may still interfere. If the conflict continues after disabling the theme pop-up, check for other cart-related apps running on the same store.

URL parameters and returning to a previous page

There is no URL parameter to auto-open the drawer on page load. To open the drawer from a link or script, call:

window.essentialCartApi.openCart();

The app also cannot return a customer to the exact page they were on before the drawer opened. It only opens and closes the drawer.