How to Add Your Social Link Icons in Squarespace 7.1

Squarespace Tips

Aug 24

I’m sure you are always looking for ways to increase your follower count on your social media channels, I know I am! To do this, you need to increase your exposure, tell people where they can go to follow you. Your website is a great way to do this and it’s super simple.

Here is an example of how you can add your social links to your footer, as I do on my website. But you can add this social link block just about anywhere on your site.

Let’s go through the steps to add these icons for your social links to your website.

Step 1. Add your social account URLs

From your home menu click Settings > Social Links.
Scroll down and click Add a social link or email.
Copy and paste the URL from your profile page (ex. http://facebook.com/mypagename) and click enter.
Repeat for all of the social media accounts you want displayed on your website

Sweet Tip

To add an email icon, just paste your email address in the same field. This will create an envelope icon will represent your email address.

Step 2. Add a social link block

To display your social icons on your website, you will need to add a social block wherever you want them displayed.

Click Edit on the page you want to add your icons and scroll to the section you want to add them.
Click + Add Block (if you are using Fluid Engine, or click the + to add the block in Classic Editor) and select Social Links.
Style your icons by double-clicking on the block and selecting Design where you can change the border style, alignment and size.

Step 3. Change the color of the icons

The colors are set in your Site Styles and are based upon which color theme is set for the section that your social icon block is.

Open the Colors section in your Site Style menu.
Select the theme that represents the section you are working in. In this example, this is the Lightest 1 theme.
Try clicking on the social link block first and see if it will isolate those settings (I find that sometimes this works and sometimes it doesn’t). If not, scroll down until you find the Social Links Block color settings and adjust the color as needed.

Open the color theme for the section where your social links are

Optional - Display social icons in your main navigation

Now that everything is setup, it is easy to add your social icons to your main navigation and we can do so with just a couple clicks.

Click Edit and then hover over the main navigation until you see the button appear and click Edit Site Header.
In the Global Settings menu that pops up, select Elements and then toggle on the Social Links option.
Adjust the size of the icons as needed.
The color of these icons is set in your Site Style menu to match the color of the Header Navigation Links