[Luminette Lucimed]

I would like to redesign the "add to cart" button so I created a custom button :

<a class="btn btn-large add-to-cart" data-single-product-id="36382049">Ajouter au panier</a>

with such method :

$('.add-to-cart').click(function() {
    var id_product = $(this).data('single-product-id');
    Ecwid.Cart.addProduct(id_product);
});

My problem is that I would like to show the shopping cart after product addition. I know that it's possible to define a callback method but can't find the method to call to open the cart.

Can you help ?

Nobody ?

[Maya]

Originally Posted by Luminette Lucimed

I would like to redesign the "add to cart" button so I created a custom button :

<a class="btn btn-large add-to-cart" data-single-product-id="36382049">Ajouter au panier</a>

with such method :

$('.add-to-cart').click(function() {
    var id_product = $(this).data('single-product-id');
    Ecwid.Cart.addProduct(id_product);
});

My problem is that I would like to show the shopping cart after product addition. I know that it's possible to define a callback method but can't find the method to call to open the cart.

Can you help ?

Nobody ?

Hello,

I'm sorry for delay with answer.

In order to execute this script properly, Ecwid main script should be added on your page. Please, make sure you have following script installed:

<script type="text/javascript" src="http://app.ecwid.com/script.js?STORE_ID" charset="utf-8"></script>

where STORE_ID should be changed to ID of your store.

Once you do this, script will work as expected.

Good luck!

[Luminette Lucimed]

Hi Maya,

This is not the problem, Ecwid main script is added properly and the script works as expected.

My question is : How to open (show) the minicart after adding a product in it (in the addProduct callback method).

I found a "quick and dirty" solution, but I'm not entirely happy with that

$('.add-to-cart').click(function() {
	var id_product = $(this).data('single-product-id');
	Ecwid.Cart.addProduct({
		id: id_product,
		callback: function(success, product, cart){
			console.log(success); // true or false
			console.log(product.name);
			$('.gwt-InlineLabel').click();
		}
	});
});

[Maya]

Hello,

You'd better to change your store URL hash to redirect customer to cart page, where "Add to cart" button is clicked. Use following code:

window.location.hash = "#!/~/cart";

Thus, you will get following code:

$('.add-to-cart').click(function() {
	var id_product = $(this).data('single-product-id');
	Ecwid.Cart.addProduct({
		id: id_product,
		callback: function(success, product, cart){
			console.log(success); // true or false
			console.log(product.name);
                        window.location.hash = "#!/~/cart";
		}
	});
});

Good luck!