Shopping cart example

This is a simple Shopping card example

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/shopify-cartjs/0.4.1/cart.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/shopify-cartjs/0.4.1/rivets-cart.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css">
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script>
<div class="example example-live"><div class="well well-sm"><img src="//cdn.shopify.com/s/files/1/0538/1121/t/2/assets/loader.gif?5845758852932070964" class="cart-visible-loading pull-right" width="16" height="11" alt="Loading...">
You have
<strong data-cart-render="item_count">0</strong>
items in your cart for a total of
<strong data-cart-render="total_price_money_with_currency">€0.00 EUR</strong>.
</div><div class="row"><div class="col-xs-4"><button data-cart-add="716934999" data-cart-quantity="1" class="btn btn-block btn-default"><span class="hidden-xs">Add </span><span class="visible-xs-inline">+</span>Hat</button></div><div class="col-xs-4"><button data-cart-add="716986707" data-cart-quantity="2" class="btn btn-block btn-default"><span class="hidden-xs">Add 2 </span><span class="visible-xs-inline">+</span>Coats</button></div><div class="col-xs-4"><button data-cart-clear="" class="btn btn-block btn-default">Clear<span class="hidden-xs"> Cart</span></button></div></div></div>

<br><br>
<!-- Cart table, rendered using DOM Binding  -->
<table data-cart-view="data-cart-view" class="table table-bordered table-condensed table-striped table-vertical-middle">
  <thead>
    <tr>
      <th>Item</th>
      <th class="text-center">Price</th>
      <th colspan="2" class="text-center">Qty</th>
      <th class="text-right">Line Price</th>
    </tr>
  </thead>
  <tbody><!-- rivets: each-item -->
    <tr...

JavaScript

CartJS.init({"token":"0363fa84c577a0d01f2c201e7b435c09","note":null,"attributes":{},"original_total_price":0,"total_price":0,"total_discount":0,"total_weight":0.0,"item_count":0,"items":[],"requires_shipping":false,"currency":"EUR"}, {
      dataAPI: true,
      requestBodyClass: 'cart-loading',
      currency: 'EUR',
      moneyFormat: '€{{amount}}',
      moneyWithCurrencyFormat: '€{{amount}} EUR',
      weightUnit: 'kg',
      weightPrecision: 1
    });