Skip to content

Opening the cart

The cart opens when a shopper:

  • clicks a link to your cart page, such as the cart icon in most themes’ headers,
  • adds a product, if Auto-open is on in Global settings. This covers the theme’s add to cart buttons and any other script that adds through Shopify’s cart API.
  • clicks the element you set as Trigger selector.

It closes with its close button, the Escape key, or a click on the page behind it if Clickable overlay is on.

If your theme’s cart button isn’t a link to /cart, or you’ve added a button of your own, give it a class and enter that class as the Trigger selector, with a dot in front:

<button class="open-cart">Your bag</button>

Trigger selector: .open-cart

The selector has to match the element the shopper clicks, not one around it. If your button contains an icon, make sure the icon doesn’t catch the click, for example with pointer-events: none on the icon in your theme’s CSS.

Theme and app developers can open the cart from JavaScript:

window.NativeSlide.open();

See Storefront API for closing it, checking whether it’s open and the rest of the API.