How do I add my social media icons to Squarespace?
As social media continues to be an integral part of our everyday lives, it’s never been more important to make sure that your website includes social media icons. This allows visitors to easily connect with you on various social media platforms, and it’s a great way to promote your brand and increase your online presence. In Squarespace, adding social media icons can be done using HTML code. Here’s how you can do it:
Step 1: Choose your social media icons
Before you can add social media icons to your Squarespace website, you need to choose the icons that you want to use.
You can use NiftyButtons to choose and style your icons and get your code.
There are other places where you can find free social media icons, such as Iconfinder.
Step 2: Upload the icons to Squarespace
(Skip this step if you use Niftybuttons to get your code)
Once you’ve chosen the icons you want to use, you need to upload them to your Squarespace website. To do this, go to the Pages panel in your Squarespace account, and select the page where you want to add the icons. Click the “+” sign to add a new block, and select the “Image” block.
Now, you need to upload the social media icons that you downloaded in Step 1. To upload the icons, click “Upload” in the Image block, and select the icon files from your computer. Once the images have uploaded, you can edit the image block to adjust the size and alignment of the icons within the block.
Step 3: Add HTML code for the social media links
Now that you’ve uploaded your social media icons, you need to add HTML code for the links to your social media profiles. (If you used Niftybuttons, you will not need to write the code yourself).
In the Pages panel, select the page where you want to add the social media icons, and click the “+” sign to add a new block. Select the “Code” block, which is located under the “More” section.
In the Code block, you can add the HTML code that will link your social media icons to your social media profiles. If you are writting your own HTML code, it will look something like this:
<a href="https://www.facebook.com/YourFacebookPage/" target="_blank"><img src="your_facebook_icon_url"></a>
<a href="https://www.instagram.com/YourInstagramProfile/" target="_blank"><img src="your_instagram_icon_url"></a>
<a href="https://twitter.com/YourTwitterProfile/" target="_blank"><img src="your_twitter_icon_url"></a>
<a href="https://www.linkedin.com/in/YourLinkedInProfile/" target="_blank"><img src="your_linkedin_icon_url"></a>
You can replace the URLs with the links to your social media profiles, and replace the image URLs with the URLs for the social media icons that you uploaded in Step 2. If you’re not sure what your image URLs are, you can find them by clicking on the individual image blocks that you uploaded earlier.
Step 4: Position the social media icons
Once you’ve added the HTML code to your Code block, you can position the social media icons where you want them on the page. To do this, you can use the Style Editor in Squarespace.
Simply click on the “Edit” button for the page that you’re working on, and select the “Style” tab. From here, you can adjust the spacing, size, and alignment of the social media icons to make them look just the way you want them to.
Step 5: Save and publish your changes
Once you’re happy with the placement and appearance of your social media icons, you can save your changes and publish the page. To save your changes, click on the “Save” button in the top right corner of the page editor. To publish the page, click on the “Publish” button in the top left corner of the Squarespace dashboard.
