Custom Social Icons | Squarespace 7.1

Adding Social Icons to your Squarespace Website is a good way to connect with your audience and show them which platforms you are active on. Squarespace can recognise several different platforms and can automatically add the logo for those platforms to you header.

You can see a list of which platforms are supported here.

However, when you are using a platform that is not supported, Squarespace will show a link icon instead. In a previous video, I showed you how to replace a social icon or the cart icon with the header.

In this video, I show you how to have a custom social icon on other areas of the your Squarespace Website. All of the code used in the video is provided below.

The following code is used in the video.

.sqs-svg-icon--list a:nth-of-type(1) {
  svg {      
    display:none;   
  }   
  background-image: url(IMAGEURL);   
  background-size: 100%;   
  background-repeat: no-repeat;   
}

Here are some other posts you may like:

• Remove Underline from Links in Squarespace 7.1

• Custom Cart Icon in the Header | Squarespace 7.1

• Replace Social Icons in the Header | Squarespace 7.1