I was looking for a way to hide the shopping cart icon when the cart is empty. I couldn't find my answer online and reached out to support. They offered the following code, which works great.
I wanted to add it here, in case it may help someone else. The following code needs to be added to Site Settings > Header and Footer Code > Header Code.
- <script>
- document.addEventListener("zp-event-cart-count", isCartEmpty);
- function isCartEmpty(cartCountEvent){
- let cartCount = document.querySelector("[data-zs-view-cart-count]");
- let cartIcon = document.querySelector("[data-zs-view-cart]");
- if((cartCountEvent.detail.cart_count === 0)){
- cartCount.style.display = "none";
- cartIcon.style.display = "none";
- } else {
- cartCount.style.display = "block";
- cartIcon.style.display = "block";
- }
- }
- </script>