Cart block ajax: background and click to view

[toncika]

Hello to everyone,

 

I would like to make two changes to my Cart block and don't know where to change. When I put my mouse on the Cart there's a block that appears with all the informations. I would like to make it visible only after clicking on the cart. Is it possible?

Second thing: the background of the ajax is now black and dark grey. Where can I change it?

 

Thank you very much

[vekia]

everything depends on:

- what prestashop version you use

- what prestashop theme you use

- what module you use for cart

 

can you share url to your shop?

 

usually it's blockcart module and you can change blockcart.tpl file located:

- in module directory

- if exists in your theme: /themes/YOURTHEME/modules/blockcart/blockcart.tpl

[toncika]

Hi Vekia, sorry I forgot to write it.

It's version 1.6, default-bootstrap theme. The cart module I think it is default, as it comes with the default theme. I didn't change it.

 

It's not online, I'm configuring it on my localhost. I searched the blockcart css and tpl files trying to modify it but get no result. Can you please help me (explaining it as to a 4-year old child )?

[vekia]

/themes/default-bootstarp/js/modules/blockcart/ajax-cart.js

 

there is a code:
 

	$("#header .shopping_cart a:first").hover(
		function(){
			if (ajaxCart.nb_total_products > 0 || cart_qty > 0)
				$("#header .cart_block").stop(true, true).slideDown(450);
		},
		function(){
			setTimeout(function(){
				if (!shopping_cart.isHoveringOver() && !cart_block.isHoveringOver())
					$("#header .cart_block").stop(true, true).slideUp(450);				
			}, 200);
		}
	);

change it to:

	$("#header .shopping_cart a:first").toggle(
		function(){
			if (ajaxCart.nb_total_products > 0 || cart_qty > 0)
				$("#header .cart_block").stop(true, true).slideDown(450);
		},
		function(){
			setTimeout(function(){
				if (!shopping_cart.isHoveringOver() && !cart_block.isHoveringOver())
					$("#header .cart_block").stop(true, true).slideUp(450);				
			}, 200);
		}
	);

[toncika]

Thank you very much Vekia. Anyway it's not working good: if I click, the cart opens; when I run the mouse out of the cart, the ajax disappears but the cart is still "opened" or "clicked". For re-open it again I need to click to disable or "close it" and then click again to re-open it. Is it possible to fix it?

 

Any suggestion also how to change the background color?

[vekia]

you have to decide, if you want hover effect - cart will not work with click,

if you want to click effect, hover will not work anymore

 

there are some possibilities, but it will be necessary to code them

$("#header .shopping_cart a:first").mouseout(function() {
setTimeout(function(){
				if (!shopping_cart.isHoveringOver() && !cart_block.isHoveringOver())
					$("#header .cart_block").stop(true, true).slideUp(450);				
			}, 200);
});

[toncika]

Ok... will do some tests to see which one looks better.

What if I'd like to turn off both and make the button just clickable to get to Shopping cart/Quick order page?

 

Thank you.