Controlling which image appears when sharing web pages on social media can be tricky for website owners!
Sharing web pages on social media platforms such as Facebook and LinkedIn can be really helpful for your business but extremely frustrating if the picture associated with your URL is wrong or non-existent. I suffered from this frustrating problem and will show you how to resolve this issue.
Start with the Picture you want to be displayed
The first step is to properly add the correct metadata tag to the picture you choose so that the social media platforms (in this case Facebook and LinkedIn) will display the image you want to be shown instead of a picture of their choosing (that’s the frustrating part!). Adding embedded metadata to a photo is a bit like writing your name and phone number on the back of a snapshot. In this case, Facebook and LinkedIn are looking for the “og:image” metadata tag. This tag tells them which image you want to be displayed. Without it, they choose an image for you.
How Do I Add The "og:image" Metadata Tag?
For a Mac user (as I am), first save the picture to your computer. Locate the image, right click on it and choose the “Get Info” option.
Use the white box to type in og:image, hit enter and the tag will be saved. You can now close the window.
For Windows users, here is a great article explaining the process.
Make sure your image is the correct size for sharing
- Max file size: 5 MB
- Minimum image dimensions: 1200 (w) x 627 (h) pixels
- Recommended ratio: 1.91:1
You can now upload your photo
If you are a WordPress user, go ahead and upload the photo to your media section. Also, if you use the Yoast plugin, go to the Yoast option on your Dashboard and head to the Social page. Click on Facebook and make sure to enter the Image URL to the picture you uploaded above. *If you try to share your page right away, you will most like encounter a cached version of your URL if you or anyone else for that matter has shared your link before. See below for additional information on platform specific tips.
Facebook has a great developers page which shows what existing information they use for your URL. A surprising tidbit is that if someone shared your URL 8 years ago, Facebook will use the image that they used previously for your page even if you have an entirely re-designed site. Do not worry though, you can reset the information that Facebook has for your URL by going to this link.
Type in the URL you want to check and two options will appear. First check what Facebook is already using for your URL. Then, after completing the steps above, use the “Fetch new scrape information” button to reset what they use for your site. Remember to read the results for errors. If everything goes correctly, head on over to Facebook and type your full URL (ex: https://springboardlabs.tech) into the Post section and you will immediately see that Facebook goes out to fetch the new information for your URL.
LinkedIn unfortunately does not have an option to reset their saved data for your URL. You have to use the following trick to force LinkedIn to get the latest info. Append “/?latest” to the URL you enter in the Post field in LinkedIn to force them to retrieve the current info. So an example would be “https://springboardlabs.tech/?latest” would result in the current info. If you do not append “/?latest”, you will have to wait 7 days for LinkedIn to clear their cache files for your URL.
Make sure to use a good photo for your site to convert people. You can read more about The Importance Of Good Photos For Your Website and how it effects your conversion rate. Also, make sure that when visitors click on your site, they don’t end up on my Top 5 Worst Website Design Fails Ever page. 🙂 . Great photos and great design really does matter.
