How to Add a Social Media Link Preview (Social Sharing Image) in Squarespace
You have this great new website that you want to share with the world. You go to social media to spread the word but when you add your link a stretched or distorted version of your logo comes up or you get a big space with no image at all.
So what happened?
The social media site couldn’t find your social sharing image, so it used your logo, some other random image or nothing at all.
To fix this you need to add or update your Squarespace social sharing image.
What is a Social Sharing Image?
A social sharing image is simply an image that shows up when you add your link on social media sites like Facebook or LinkedIn.
With Squarespace you can have more than one social sharing image. There is a default site-wide social sharing image and an alternate social sharing image that you can add on each page or blog post.
This is the way my default social sharing image currently looks on Facebook.
Social media sites will choose your link image in this order:
Alternate Social Sharing Image
Site Social Sharing Image
Logo
???
I would recommend that you add at least the default site-wide social sharing image. So if anyone shares a link from your website there’s always a good picture to preview your website and entice people to visit.
How to Add your Site Social Sharing Image in Squarespace
The steps to add your default site social sharing image are the same in Squarespace 7.0 and Squarespace 7.1
1. From the Home Menu click Settings
2. Click Social Sharing
3. Click the + to add your Social Logo
4. Save
How to Add an Alternate Social Sharing Image
To add an alternate social sharing image to a page:
Hover over your page name in the menu
Click on the cog icon to open the Page Settings
Click Social image > Add Image
Save
To add an alternate social sharing image to a blog post:
Squarespace 7.0
From your Home Menu click Website > Pages
Click on your Blog Page
Hover over the Blog Post name and click Edit
Click on the Social tab
Click on the arrow to upload an image or search your asset library
Save
Squarespace 7.1
From your Home Menu click Website
Click on your Blog Page
Hover over the Blog Post name and click the three dots •••
Click Settings and choose Social Image
Add Image
Save
What Size Should I Use for My Squarespace Social Sharing Image?
I actually use two different sizes for my social sharing images.
For the default site-wide image I use a square image. That way no matter where my website is shared or how often they change their image size (I’m looking at you Facebook) the image will look good. Keep in mind if you do this, you’ll want the important parts of your image in the middle as the top and bottom may be cut off. The image I use is 1200 x 1200px.
Here’s an example of how to set up your default social sharing image to make sure nothing important gets cut off.
I use the alternate social sharing image when I share my blog posts. Since I mostly share to Facebook and LinkedIn I use 1200 x 630px. That is the exact current size of Facebook’s link preview images and just slightly off LinkedIn’s link image preview size (1200 x 628px).
You can use a jpg or png image for sharing, but you should avoid using a transparent background for your image. Facebook doesn’t support transparency and you could get a weird result like a black background instead.
Why Am I Getting the Wrong Social Sharing Image in Facebook?
Facebook doesn’t always realize that the social sharing image has changed. Sometimes it will just take a few days, but you really don’t have to wait.
Instead, head to the Facebook Sharing Debugger Tool. Add your URL and click debug to see your image. If you don’t see the image that you add there click Scrape Again.
You may have to do this more than once to get Facebook to clear the old image.
Why Am I Getting the Wrong Link Preview Image in LinkedIn?
LinkedIn can have the same issue that Facebook does, where it doesn’t realize that the social sharing image has been changed (though it doesn’t seem to happen nearly as often). Luckily, LinkedIn has a tool to update your image too. Go to the Post Inspector and add your URL.
Now your social share images are in place and looking great. It’s time to share your links with everyone!