Custom Cart Icon in the Header | Squarespace 7.1

Jun 10

Squarespace 7.1 allows you to edit the size and visibility of the cart icon. However, it does not give you the option to change the icon itself.

In this video, I show you how to replace the cart icon in the header with a custom image or icon of your choosing. All of the code used in the video is provided below.

The following code was updated Dec 6, 2024.

.icon--cart {   
  path {     
    display:none;   
  }   
  background-image: url(IMAGEURL);   
  background-size: 20px 20px;   
  background-repeat: no-repeat; 
}