...

Code Block
languagexml
titleIntegration of the cart widget
...

<!-- Cart widget configuration BEGIN -->

	<!-- Add widget assets (JS and CSS) -->
    <link rel="stylesheet" href="/apps/widget/dist/app.full.min.css">
    <script src="/apps/widget/dist/app.full.min.js"></script>

	<!-- Cart Widget configuration -->
    <script>
        window.affilicon = {
            countryId: '[countryId]',
            formConfig: '[formConfig]',
            vendor: '[vendor]'
        }
    </script>

	<!-- Custom style of the cart widget elements (optional) -->
    <style>

        cart-container .cd-cart-container .cart-heading {
            color: red;
        }

        cart-container .cd-cart .purchase-button {
            background-color: red;
        }

        cart-container .product-name {
            color: red;
        }

        cart-container .product-price {
            color: red;
        }

        add-to-cart-button .cart-button.btn-default {
            color: red;
        }

    </style>

<!-- Cart widget configuration END -->

...

<!-- Buttons that add the products -->
<add-to-cart-button product-id="[productId]"></add-to-cart-button>
<add-to-cart-button product-id="[productId]"></add-to-cart-button>
<add-to-cart-button product-id="[productId]"></add-to-cart-button>

...

<!-- Cart container in the right bottom corner -->
<cart-container></cart-container>

...