Show different social links or icons in Squarespace (walkthrough video)
👇 Keep reading for a complete Walkthrough Video at the end of this post.
Like me, you probably build websites on Squarespace because it is easy to use. It's a great platform, but sometimes that simplicity comes with limitations.
Problem 1: Can’t link to different social media profiles
One of the limitations I bump into ALL THE TIME is that I want to use social media icons for different people on the same site.
Essentially, I’d like to add multiple social icons (LinkedIn, for example) to link out to DIFFERENT social media profiles (person 1’s LinkedIn, person 2’s LinkedIn, etc.). In Squarespace, we are limited to only one link per icon. Argh.
But there’s a workaround…
Problem 2: No TikTok icon in Squarespace (and missing icons in general)
Another issue is that Squarespace is WAY behind on the icons it includes for social media links.
In fact, in February 2022 when I’m writing this, there’s still no TikTok icon. So if you want to use the built-in Social Links block and link out to your TikTok? You can’t.
Update: In April 2022, Squarespace has gifted us with the TikTok icon. Use the method below for other missing icons!
But there’s a workaround…
The Solution
SQSMods has made a fantastic work-around plugin Custom Social Icons Everywhere and I’ll walk you through an example of how to use it in the video below.
👉 They have generously given 10% off the purchase price for readers of this blog using coupon code CPDISC10 at checkout.
This plugin works in:
Main navigation, using the link option (I added a Tiktok icon to the main navigation in the image above)
List (or auto layout) sections
All Image blocks like Poster, Collage, Card (My example below uses the Image block styled as a Stack)
All Summary blocks
Regular text blocks
…basically ANY block where you can create a text link
Note: This solution requires the business plan or higher of Squarespace because we will be pasting in sitewide code.
✅ Step 1:
Purchase the Custom Social Icons Everywhere and paste the code into your Squarespace website. (See the video below for a detailed walkthrough.)
✅ Step 2:
You'll need to source some social icons. Here is the social icon pack that I'm using in this demo - it’s free for commercial use. It doesn’t include TikTok, so here’s a link to another free icon pack that does.
✅ Step 3:
You’ll need to upload those icons through the Custom CSS panel to your Squarespace site. Then grab those new image links.
✅ Step 4:
You’ll paste the image links into the plugin code. (It's easier than it sounds.)
✅ Step 5:
Last, you’ll add specific text links wherever you want the social icons to appear.
DON’T WORRY >> you won’t see the icons until you’ve saved the page and are outside of edit mode.
Optional: tweak the icon size or spacing in the plugin code.
The Walkthrough
If you have any questions about how the plugin works, or need a hand with anything, please reach out to SQSMods who created the plugin - they can help with support.
>> Get the plugin here and use coupon code CPDISC10 for 10% off.
