The process of Shopping Cart configuration has two stages—first is to create Shopping Cart per se at CopeCart, and the second is to configure it at your website. 

To function properly, Shopping Cart itself and all the products you would like to be sold via Shopping Cart should be created as digital products. For now, no shipping can be provided in this case.

How to create a Shopping Cart at CopeCart

Create a Shopping Cart as a digital product and contact us at support@copecart.com or via Chatbox so we set the Shopping Cart’s price to 0€ (by default, product price should exceed 1€). 

Think of this Shopping Cart product as of container for your other products. 

Next, you should create other digital products that will be sold via Shopping Cart. When they are created, add all of them as Addons to your Shopping Cart product.

How to configure Shopping Cart at your website

After you have created a Shopping Cart and all the products at CopeCart, you should integrate them with your website.

1. Find an opening <body> tag and insert after it the next code line:  

<script src="https://copecart-public-prod.s3.eu-central-1.amazonaws.com/js/load_cart.js"></script>

 2. Customize the next script from the file https://copecart-public-prod.s3.eu-central-1.amazonaws.com/js/cart.js and add it below the code line in Step 1:


// display the cart contents.
// e.g.: <button onclick="return cc_cart_show(this);">Show cart</button>
function cc_cart_show()
{
  return cc_cart_show_exec()
}

// add item to cart
// e.g.: <button onclick='return cc_cart_add(12345);'>Add item</button>
function cc_cart_add(product, addon, quantity)
{
  return cc_cart_add_exec(product, addon, quantity);
}

// remove all items from cart
// e.g.: <button onclick='return cc_cart_clear();'>Remove items</button>
function cc_cart_clear()
{
  return cc_cart_clear_exec();
}

When adapted to your website, it should look something like this:


<script>

shoppingCart('c16bc9e2')

$(document).ready(function(){
    $('#element-294').click(function(){
     cc_cart_add('c16bc9e2', 'ca74cd24', 1)
    });
});

$(document).ready(function(){
    $('#element-320').click(function(){
     cc_cart_add('c16bc9e2', '57d607b5', 1)
    });
});

$(document).ready(function(){
    $('#element-294').click(function(){
     cc_cart_add('c16bc9e2', 'a7985b08', 1)
    });
});

</script>


This is how the customized part should look like at your page (click on image for higher resolution):

The slug of Shopping Cart (the product ID of Shopping Cart) should be the same for all function configurations. 

The slugs of Addons (Addons product IDs) should be unique to let the script to differentiate the products.

When configured this way, products set as Addons for your Shopping Cart at CopeCart will be displayed as separate products on your website (click on image for higher resolution). 

  • Reminder: If you have, for example, 50 products to be sold via Shopping Cart, you should configure all 50 of them, correspondingly.

Did this answer your question?