My Link Previews Don't Look Right?
However, the preview that we show in the Queue is not used in the final post when published, as both Facebook and Twitter generate their own link previews independently, using information taken directly from the link that you’re sharing.
In this article
- What causes incorrect link previews on Facebook/Twitter?
- Checking what’s wrong with your link previews
- How to fix broken link previews
- Common questions
What causes incorrect link previews?
The link preview is controlled by the author of the web page you’re sharing, and by Facebook/Twitter. The website author adds specific metatags to the website, and Facebook/Twitter depend on those metatags in order to render the link preview.
If Facebook or Twitter does not find valid metatags, they will not be able to render the link preview; or they may fill in the blanks using other information found on the website.
Another common problem is when the web page has multiple image metatags – this may cause Facebook/Twitter to choose a different image to the one that you want to use. This often happens if you have a blog plugin that adds too many image metatags.
Sometimes a website may not load quickly enough for Facebook, so they will give up trying to fetch the preview, and show a broken link preview instead. The sharing debugger may may mention a “timeout” issue. Either way, you should ensure your website loads quickly and reliably.
Some websites do not allow bots (such as Facebook/Twitter's) to fetch your page if the URL contains Google Analytics UTM tags. This is normally controlled in a file on your website called robots.txt. You should edit this file to allow bots to load your site if the URL contains UTM tags. If you are trying to prevent bots from inflating your analytics, you should set up filters in your analytics software to ignore bots instead.
SmarterQueue simply shares the link – it’s up to Facebook or Twitter, as well as the author of the web page, to determine how to display the title, description, and image in the link preview.
Checking what’s wrong with your link previews
Both Facebook and Twitter provide tools to help you debug issues with link previews.
You can enter the link URL that SmarterQueue shows in the Queue, and see how the link preview will look, or what errors may be reported.
Facebook’s tool is the Sharing Debugger.
Twitter’s tool is the Card Validator.
How to fix broken link previews
Both Twitter and Facebook provide developer documentation for how to set up the correct metatags on your website so that they can generate link previews correctly.
If you update your website metatags, you can force-refresh Facebook’s cached version of your link preview by clicking Scrape Again in the Sharing Debugger.
Note: Once a link has received more than 50 likes/shares/comments, you will not be able to update the Title shown in the link preview.
It may be possible to update Twitter Card previews by using the card validator again, though if that doesn’t work, Twitter should update the Twitter Card previews weekly.
Why does the link preview break when I add UTM parameters or link tracking?
It’s important to use the final link shown in the SmarterQueue preview, and not just the original link of your website or article. The final link may have additional UTM parameters added, or link tracking with Bitly, each of these may affect how the link preview is rendered.
- If you turn UTM tracking on, we add query parameters to the link (e.g. domain.com/?utm_source=social&utm_medium=facebook)
- If you turn Bitly on, we add a query parameter to the link, to make the Bitlink unique (e.g. domain.com/?utm_sq=123456789).
Some websites are poorly configured, and cannot handle query parameters correctly. In these cases, adding UTM parameters or Bitly tracking may prevent Twitter or Facebook from generating a link preview. We strongly recommend ONLY adding UTM parameters to websites you control, as you may create a broken link to someone else’s website, without any ability to fix it.
For example, some websites have a robots.txt file configuration which prevents Twitter or Facebook from fetching any page that contains query parameters, or specific UTM parameters.
If you find that link previews don’t work when you use UTM or Bitly for your own website links, you will need to fix your website so that it works with UTM parameters added to the URL.
Alternatively, you can turn off Bitly click tracking for specific posts, whenever sharing links to that website.
Why does the link preview use a different image to the post preview shown in SmarterQueue?
This usually happens is the web page has multiple image metatags. Most of the time, this will be due to a blog plugin which adds its own image metatags.
Ideally, there should only be one image metatag for the web page. You may need to disable some plugins if they are adding multiple image metatags, and ensure you set the image metatag correctly.
In WordPress, this is often done by setting the Feature Image – or you can use a plugin like Yoast SEO to help you control your social metatags.