Hide the empty shopping cart on Squarespace

17 Jan

Here’s a simple code snippet to allow you to hide the shopping cart icon when the cart is empty. It has been updated to work on Squarespace 7.1 and Brine-family templates on Squarespace 7.0.

Add the following styling to Design > Custom CSS:

  
    /* Hide empty cart icon on Squarespace */
/* Copyright Soundfocus [sf.digital]   */
/* Use freely on your Squarespace site */
/* DO NOT REPUBLISH                    */
a.sqs-custom-cart:not([aria-label]), a.sqs-custom-cart[aria-label^="0"] {
  visibility: hidden!important;
}

  
  

This uses ‘visibility: hidden’ to hide the cart icon without affecting the other header elements. You could use ‘display:none’ instead but it would cause the other header elements to ‘jump’ when the icon appears.

What's my site's template and version?