The button in default OpenCart theme (AKA the mini cart) that shows pop-up window once you add items to the Cart proved itself as a real pain to edit. If you want to hide mini cart pop up in OpenCart 2.x for some reason but still be able to see the number of items in the cart displayed on the button, and, of course, follow the onclick action to the cart page, here is what you need to do.
As simple as it may seem on the first thought you can go and hide the pop-up itself in the stylesheet.css file which does the trick for hiding the pop-up alright. But then you realise that clicking the button doesn’t do anything else but changing the color (hover state).
Then following the common logic you try to edit the header.tpl and header.php files for $cart variable and its on click URL. And… still nothing.
Here is very simple solution which solved my case when I tried to hide mini cart pop-up in OpenCart 2.x default theme.
1. Hide the mini cart popup window
Go to catalog/view/theme/default/stylesheet/stylesheet.css and open the file in text editor of your choice.
Find the #cart .dropdown-menu element selector and add display: none; declaration. Mine looks like this:
#cart .dropdown-menu {
background: #eee;
z-index: 1001;
display: none;
}
Also if you want to hide it on mobile devices do the same in @media (max-width: 478px) element. Mine looks like this:
@media (max-width: 478px) {
#cart .dropdown-menu {
width: 100%;
display: none;
}
}
2. Don’t lose time messing with the $cart variable
There, I said it… don’t lose time on this. Skip to step 3.
3. Add the scrypt to the footer.tpl file
Go to catalog/view/theme/default/template/common/footer.tpl and open the footer.tpl in text editor of your choice. Add the following code to the bottom of the file just before the closing </body> tag:
<script>
$(function(){
$('#cart').on('click',function(){
window.location = 'index.php?route=checkout/cart'
});
});
</script>
Upload files back to the server, reload the website and enjoy the lack of mini cart popup window with the button still displaying the number of items in the cart and hopefully leading you to cart page when clicked 🙂
