Social Preview Fixes: Every Platform, One Place
A link preview is the card that appears when someone shares your page: an image, a title, a line of description and the site name. Every platform builds that card itself, by sending its own crawler to fetch your page and read the tags in the head.
Most of the tags are shared, but each platform has its own crawler, its own image rules, its own cache and its own way of refreshing a stale card. This page explains what they have in common, where they differ, and which of our guides fixes each problem.
The fix guides, platform by platform
Each guide covers one platform from start to finish: how it builds the preview, the tags it reads, the images it accepts, why its crawler gets blocked, how to clear its cache, a step-by-step fix, and the questions people ask most.
Facebook and Messenger
Facebook's crawler, facebookexternalhit, reads Open Graph tags and keeps what it finds
for weeks, which is why a fixed page can go on sharing with an old image. The guide covers the Sharing
Debugger and its Scrape Again button, why og:url pointing at the home page makes every page
share the same card, image sizes that turn a wide card into a small thumbnail, and refreshing many pages
at once through the Graph API.
LinkedIn's crawler, LinkedInBot, reads Open Graph tags only and ignores Twitter card
tags. The guide covers LinkedIn Post Inspector, the 1200 by 627 image size, why LinkedIn shows a logo
when it cannot fetch the real image, how long it keeps an old preview, and why a post that has already
been published keeps its broken card even after the page is fixed.
X (Twitter)
X reads its own twitter: tags first and falls back to Open Graph tags. The twitter:card
value decides whether a link gets a large image or a small square one. The guide covers the card types,
image ratios, how Twitterbot gets blocked, and how to check a card now that X no longer
offers a public preview in its old Card Validator.
WhatsApp builds previews from Open Graph tags, but it is far less patient than the other platforms: large images and slow pages often produce a preview with no picture. The guide covers keeping the share image small, making sure the image and page respond quickly, and why the same link can preview on one phone and not on another.
iMessage
iMessage is the odd one out: the preview is built on the sender's device when the message is sent, not on a central server, so there is no cache to clear and no debugger to use. The guide covers the tags Apple reads, how it chooses between an image and an icon, and why a slow page produces a plain link instead of a card.
Slack
Slack calls previews "unfurls". Its link expander reads Open Graph and Twitter tags, fetches images
through a separate proxy, and shows extra labelled fields from twitter:label1 and twitter:data1.
The guide covers the two Slack user agents, workspace and personal preview settings, unfurl_links
for app and webhook messages, and forcing a fresh unfurl without a refresh tool.
Discord
Discord calls previews "embeds". Discordbot reads Open Graph tags, uses twitter:card
to choose a large image or a thumbnail, and takes the colour of the bar down the side from theme-color.
The guide covers the Embed Links permission, suppressed embeds, links in angle brackets, and forcing
a fresh embed.
Problems that cut across platforms
Fixing preview cache problems brings the refresh method for every platform together in one place, for the common case where a page is fixed but the old preview keeps appearing. The site-platform guides cover where the tags come from on the most common systems: WordPress, where the theme and SEO plugins can both print tags; Shopify, where the theme, product images and apps all play a part; and Next.js, where tags must be rendered on the server rather than in the browser.
Which problem do you have?
Most broken previews fall into a handful of patterns. Find the symptom, then go to the guide for the platform where you saw it.
| What you see | Most likely cause | Where to look first |
|---|---|---|
| No preview at all, just a bare link | The platform's crawler was blocked, timed out or received a login or challenge page. | Your server access log, searched for that platform's crawler. |
| Title and text but no image | The image is missing, too small, too large, on a relative address or blocked separately from the page. | Open the og:image address in a private
browser window. |
| Small square thumbnail instead of a wide image | The image is below the platform's size
for a large card, or twitter:card is summary. | The image dimensions
and the twitter:card value. |
| Your logo or a random image | No og:image, so the platform picked an image
from the page. | The page source, for a single og:image tag. |
| Every page shows the home page card | og:url or the canonical tag points to
the home page on every page. | The og:url value on an inner page. |
| An old title or image after you fixed the page | The platform, or your own CDN, is serving a cached copy. | The platform's refresh tool, then your CDN cache. |
| Works on one platform, broken on another | A tag only one platform reads, a crawler blocked on only one platform, or a different image rule. | The comparison table below. |
| Works for some people, not others | A personal or workspace preview setting, a permission, or a different app version. | The Slack or Discord guide. |
How the platforms differ
All seven platforms read Open Graph tags, but that is where the agreement ends. This table sets out the differences that cause most of the confusion.
| Platform | Crawler user agent contains | Also reads | Image to aim for | How to refresh |
|---|---|---|---|---|
facebookexternalhit | fb:app_id (optional) | 1200 x 630 | Sharing Debugger, Scrape Again | |
LinkedInBot | Nothing beyond Open Graph | 1200 x 627 | Post Inspector | |
| X (Twitter) | Twitterbot | twitter: tags first | 1200 x 628 for a large card | No public tool; the cache expires |
WhatsApp | Nothing beyond Open Graph | 1200 x 630, kept small in file size | No tool; share a new address | |
| iMessage | The sender's device | Apple's own icon tags | 1200 x 630 | Not cached; send again |
| Slack | Slackbot-LinkExpanding | twitter:card, twitter:label1 | 1200 x 630 | No tool; the cache expires |
| Discord | Discordbot | twitter:card, theme-color | 1200 x 630 | No tool; the cache expires |
Three differences matter most. First, only Facebook and LinkedIn give you a tool to force a fresh
preview; everywhere else you either wait or share the address with a harmless query string such as ?v=2.
Second, LinkedIn and WhatsApp ignore Twitter card tags, so a page with Twitter tags but no Open Graph
tags previews well on X and badly elsewhere. Third, the image sizes differ only slightly, so one 1200
x 630 image serves every platform as long as its important content stays away from the edges.
One set of tags that works everywhere
You do not need a different set of tags for each platform. This set, in the head of every page and in the HTML your server sends, covers all seven:
<head>
<meta charset="UTF-8">
<title>Garden design service in Sheffield | Greenline Gardens</title>
<meta name="description" content="Garden design, planting plans and landscaping for homes across Sheffield and north Derbyshire.">
<link rel="canonical" href="https://example.com/garden-design">
<meta name="theme-color" content="#2f7d4a">
<meta property="og:type" content="website">
<meta property="og:site_name" content="Greenline Gardens">
<meta property="og:url" content="https://example.com/garden-design">
<meta property="og:title" content="Garden design in Sheffield: plans, planting and landscaping">
<meta property="og:description" content="From a single border to a full redesign, with a fixed quote after a free site visit.">
<meta property="og:image" content="https://example.com/images/garden-design-1200x630.jpg">
<meta property="og:image:width" content="1200">
<meta property="og:image:height" content="630">
<meta property="og:image:alt" content="A finished garden with new borders and a stone patio">
<meta name="twitter:card" content="summary_large_image">
</head>Rules that apply everywhere:
- Full https addresses.
og:imageandog:urlmust be complete addresses. Relative paths are ignored by most crawlers. - One of each. If a plugin and the theme both print Open Graph tags, remove one. Platforms pick between duplicates unpredictably.
- In the server's HTML. None of the crawlers runs JavaScript. Tags added by a script after the page loads are invisible to all of them.
- Near the top of the head. Some crawlers read only the start of the page, so keep the tags above large inline scripts and styles.
- og:url matches the canonical. Both should name the page itself, never the home page or an old address.
Letting the crawlers in
The most common cause of a missing preview is not a missing tag but a blocked crawler. Security tools are designed to stop automated visitors, and preview crawlers are automated visitors. When a crawler is challenged it receives a page with no tags, and the platform shows no preview.
- Bot protection. Cloudflare Bot Fight Mode, Wordfence, ModSecurity rules and hosting anti-bot settings all block preview crawlers from time to time. Add allow rules for each crawler in the table above.
- robots.txt. A rule that blocks all crawlers blocks preview crawlers too. Allow them, including on the folder that holds your images.
- Country blocking. Preview crawlers mostly run outside the UK. Blocking overseas traffic blocks them.
- Login, age and consent gates. Crawlers arrive with no cookies. If a visitor with no cookies is sent to a login or consent page, that is the page the crawler reads.
- Slow pages. Crawlers give up after a few seconds. A page that is slow to start responding may preview on one platform and not another.
Your server access log shows which crawlers reached the page and what they were given. Share the link, then search the log for the crawler's name: no line means it was blocked before it reached the site, a 403, 429 or 503 means the site refused it, and a 200 means the problem is in the tags or the image.
sudo grep -iE "facebookexternalhit|linkedinbot|twitterbot|whatsapp|slackbot|discordbot" /var/log/nginx/access.log | tail -20What the Social Preview Tester shows
The Social Preview Tester fetches your page and shows how the card is likely to look on Facebook, LinkedIn, X, WhatsApp, iMessage, Slack and Discord, side by side, so you can see where a page works and where it breaks before anyone shares it. Use it alongside the platforms' own tools: the tester shows every platform at once, and Facebook's Sharing Debugger and LinkedIn's Post Inspector refresh those two platforms' caches.
A sensible order of work for a page with problems:
- Run the page through the tester and note which platforms fail and how.
- Fix what every platform shares first: the Open Graph tags, the image and
og:url. - Check the access log for any platform that still shows nothing, and allow its crawler.
- Add the platform-specific extras:
twitter:cardfor X, Slack and Discord, andtheme-colorfor Discord. - Purge your own CDN cache, refresh Facebook and LinkedIn with their tools, and share a fresh address on the others.
For a full explanation of the tags and how each platform treats them, read the Social Preview Guide, or see a finished report in the example report.
1. Why does my link preview work on one platform but not another?
Because each platform sends its own crawler, reads a slightly different set of tags and applies its own image rules. A firewall may allow one crawler and block another, LinkedIn and WhatsApp ignore Twitter card tags, and an image that is fine for Facebook may be too large for WhatsApp to fetch in time. Run the page through the Social Preview Tester, then open the guide for the platform that fails.
2. Do I need different tags for each social platform?
No. One set of Open Graph tags covers every platform: og:title, og:description, og:image with its width and height, og:url and og:type, plus twitter:card set to summary_large_image for X, Slack and Discord. Add theme-color if you want to control the colour bar on Discord embeds. Keep one copy of each tag in the head, with full https addresses, in the HTML the server sends rather than added later by JavaScript in the browser.
3. What image size works on every platform?
A JPG or PNG of 1200 by 630 pixels works on Facebook, LinkedIn, X, WhatsApp, iMessage, Slack and Discord. The platforms differ by a few pixels, which makes no visible difference. Keep the file small, ideally well under 1 MB, because WhatsApp in particular gives up on large images, and keep text and faces away from the edges, which are cropped slightly differently on each platform and on mobile phones.
4. How do I refresh an old link preview?
It depends on the platform. On Facebook, use the Sharing Debugger and press Scrape Again. On LinkedIn, use Post Inspector. X, Slack, Discord and WhatsApp have no public refresh tool, so either wait for their cache to expire or share the address with a harmless query string such as ?v=2. iMessage builds a new preview each time a link is sent. Always purge your own CDN or page cache first, so the platform is served the fixed page.
5. Why does my preview show no image?
Usually because the crawler could not fetch the image, even though it fetched the page. The common causes are a missing og:image, a relative address instead of a full https address, an image behind hotlink protection or a login, an image folder blocked by robots.txt or a firewall, an image that is too small, or one that is too large to download in time. Open the image address in a private browser window to check.
6. Why does every page on my site share the same preview?
Because og:url, or the canonical tag, points to the home page on every page. Platforms such as Facebook treat og:url as the real address of the page, so they fetch the home page and show its preview for every link. Change og:url and the canonical tag on each page to that page's own address, usually in the theme or SEO plugin settings, then refresh the preview on Facebook and LinkedIn.
7. Can a firewall or security plugin break link previews?
Yes, and it is one of the most common causes. Bot protection, security plugins, country blocking and rate limits can all stop preview crawlers such as facebookexternalhit, LinkedInBot, Twitterbot, Slackbot and Discordbot. The crawler receives a challenge page with no tags, so the platform shows no preview. Search your access log for the crawler after sharing the link, and add allow rules for each crawler that is blocked or challenged.
The Social Preview Tester fetches your page and shows how the card is likely to look on Facebook, LinkedIn, X, WhatsApp, iMessage, Slack and Discord, side by side, so you can fix problems before anyone shares the link.
Run the Social Preview Tester →