Cart summary

A cart summary is handy, whether you want to give customers quick access to their shopping cart, or just remind them of its contents.

You can add elements in your site to interact with Snipcart; we call them hooks. For instance, you can add a special CSS class to any element to make the cart pop up.

Adding a "show cart" button

Add a button with the class snipcart-checkout to open up the cart when customers click on it.

<button class="snipcart-checkout">Click here to checkout</button>

Displaying number of items and total price

You can display the number of items in the cart, and its total price by adding snipcart-items-count or snipcart-total-price class on an HTML element.

<span class="snipcart-items-count"></span>
<span class="snipcart-total-price"></span>