Link Preview: How Social Media Previews Work + How to Fix Them — share-preview.com

Link previews explained: how Facebook, Twitter, LinkedIn, and Slack generate them, why they break, and how to fix them in under 5 minutes.

Link Preview: How It Works and How to Fix Broken Previews

A link preview — that box with a title, image, and description that appears when you paste a URL into Facebook, LinkedIn, Twitter, or Slack — can be the difference between a click and a scroll-past. Studies show links with rich previews earn 2–3× more clicks than bare URLs. This guide explains exactly how link previews are generated, why they break, and how to fix them on every platform in minutes.

When you paste a URL into Facebook, Twitter, LinkedIn, Slack, or WhatsApp, the platform immediately sends an automated bot (a web crawler) to visit that URL. The bot reads the HTML of your page — specifically the <head> section — looking for Open Graph meta tags (og:title, og:description, og:image, og:url). It then uses those values to render a preview card.

The process has three stages:

  1. Crawling: The platform's bot fetches your URL (usually within seconds to minutes of the first share). It reads your HTML head for OG tags, <title>, <meta name="description">, and in some cases the page body. If your OG tags are present and valid, the bot uses them. If not, it falls back to guessing — often pulling the page title and a random image.
  2. Caching: The parsed preview data (title, description, image URL, etc.) is stored in the platform's cache. This is critical: the platform does not re-crawl your page every time someone shares the link. The cached version persists for hours to days. This is why fixing broken previews requires both updating your tags AND clearing the platform's cache.
  3. Rendering: When a post containing your link is displayed, the platform retrieves the cached preview data and renders it as a card. The visual format (card size, image placement, title character limits) varies by platform.

The role of OG tags: Open Graph meta tags are the direct communication channel between your page and platform crawlers. Without them, previews are unreliable. With them properly configured, you have complete control over every element of the preview card. See our complete Open Graph guide for the full reference.

Twitter/X uses a similar system but reads twitter:card, twitter:title, etc. in addition to OG tags. WhatsApp reads OG tags but only shows the title and image — no description. Slack and Discord both read OG tags and additionally support structured unfurl data for registered Slack apps.

2. Link Preview on Each Platform

🔵 Facebook

Preview formatLandscape card with large image, title, description, site name
Image dimensions1200×628px recommended; 600×315px minimum
Title length~100 chars before truncation
DescriptionShown in most placements; ~250 chars before truncation
Cache duration24–72 hours
Cache refreshFacebook Sharing Debugger → "Scrape Again"

🔷 LinkedIn

Preview formatLarge image above title + description + author
Image dimensions1200×627px minimum (hard requirement — smaller images not shown)
Title length~119 chars on desktop
DescriptionShown in article posts; ~300 chars before truncation
Cache duration~7 days
Cache refreshLinkedIn Post Inspector → "Inspect"

🐦 Twitter / X

Preview formatTwo types: summary_large_image (full width) or summary (small square)
Image dimensions1200×630px for large; 120×120px for summary
Title length~70 chars before truncation
Description~200 chars; not shown in all card formats
Cache durationA few hours
Cache refreshTwitter Card Validator; or wait for natural expiry

💬 Slack

Preview formatCompact unfurl with small thumbnail, title, description, and site name
Image dimensionsDisplayed at ~200×100px; source should be at least 600×315px
Title length~80 chars before truncation
DescriptionShown; ~250 chars before truncation
Cache duration24–48 hours
Cache refreshNo manual refresh available; must wait or use a new URL

3. Why Your Link Preview Is Wrong

  • Missing or incomplete Open Graph tags If your page has no og:title, og:description, or og:image, platforms will fall back to guessing — usually showing your HTML <title> as text and either a random image or no image. The fix is to add proper OG tags to your page's <head>.
  • Broken or invalid og:image URL The og:image URL must be an absolute HTTPS URL (e.g., https://yoursite.com/og.png). If it's a relative path (/og.png), the image is blocked by CORS, returns a 404, or requires authentication — no platform can render it. Always verify the image URL by opening it directly in a browser tab.
  • Platform showing a stale cached version You updated your OG tags but the old preview still appears. This is because platforms cache crawl results for hours or days. Your tags are correct — you just need to force-refresh the cache using the platform's respective tool (see Section 4 below).
  • Page is blocked from being crawled If your robots.txt blocks common bot user agents, or your page requires a login or CAPTCHA, platform crawlers can't read your OG tags. Check your robots.txt for rules that might block facebookexternalhit, Twitterbot, LinkedInBot, or general * bot rules.
  • Image dimensions not meeting platform requirements LinkedIn ignores any image below 1200×627px. Facebook rejects images below 600×315px. If your image passes the URL check but still doesn't appear on a specific platform, dimensions are likely the issue. Test with share-preview.com to see per-platform diagnosis.

4. How to Fix a Broken Link Preview

🔵 Fix on Facebook

  1. Go to developers.facebook.com/tools/debug
  2. Paste your URL and click Debug
  3. Review any warnings (e.g., image too small, missing og:title)
  4. After fixing your OG tags, return and click "Scrape Again"
  5. The new preview appears within 1–2 minutes

Note: existing posts that were already shared will not update their previews. Only new shares will show the refreshed version.

🔷 Fix on LinkedIn

  1. Go to linkedin.com/post-inspector
  2. Paste your URL and click Inspect
  3. LinkedIn shows what it sees and refreshes its cache
  4. If no image shows, verify your og:image is 1200×627px or larger
  5. Click Inspect again after making changes

🐦 Fix on Twitter / X

  1. Go to cards-dev.twitter.com/validator (if still accessible)
  2. Paste your URL to validate card markup
  3. If the validator is unavailable, Twitter's cache is short-lived (a few hours) — wait and test again
  4. Ensure <meta name="twitter:card" content="summary_large_image"> is present
  5. Twitter falls back to OG tags, so correct OG tags usually fix Twitter previews too

💬 Fix on Slack

  1. Slack has no manual cache-refresh tool — unfurl data expires in 24–48 hours
  2. To test immediately: paste your URL into a Slack channel and watch the unfurl appear
  3. If no unfurl: check that your page isn't blocking Slackbot in robots.txt
  4. For registered Slack apps: use the Slack API to explicitly unfurl URLs with custom data
  5. Alternatively, add a query parameter (?v=2) to force a fresh crawl of the new URL variant

For platform-specific deep dives, see our guides on Facebook link preview fixes and our comprehensive social media preview not showing troubleshooting guide.

5. How to Make Your Link Preview Look Perfect

A broken preview is bad. A mediocre preview is almost as bad. Here are the 7 steps to a compelling, click-worthy link preview:

  1. Set og:title — write for clicks, not SEO Your og:title is prime social real estate. Don't just copy your page's HTML title. Write something compelling and benefit-focused. Keep it under 60 characters. "How I Doubled My Email CTR in 7 Days" outperforms "Email Marketing Best Practices Guide 2026".
  2. Write a punchy og:description You have 150–200 characters to earn the click. Answer the key question the reader has ("what's in it for me?"). Include a specific outcome or number. Avoid generic corporate copy like "Learn more about our solutions".
  3. Create a dedicated og:image at 1200×630px Don't let platforms pull a random image. Create a branded image at exactly 1200×630px — this works on every platform simultaneously. Include text that complements the title, use high contrast for readability in feeds, and keep file size under 1MB. Always use an absolute HTTPS URL.
  4. Test before publishing Use share-preview.com to verify your preview looks correct on all platforms before the link goes live. It's much easier to fix preview issues before an article is published and shared widely than after. Check for truncation, image loading, and description display.
  5. Clear platform caches after any changes After updating OG tags on a live page, force-refresh caches using Facebook Sharing Debugger and LinkedIn Post Inspector. Don't assume the change is live — verify it with each tool.
  6. Verify on mobile Preview card rendering on mobile apps differs from desktop. Facebook Mobile, Twitter/X app, and LinkedIn app all have slightly different card layouts. Share-preview.com shows mobile-accurate previews so you can check both at once.
  7. Add og:image:alt for accessibility Screen reader users encounter link previews in social apps. The og:image:alt tag provides the text alternative for your OG image. Write a clear, descriptive alt text (not just the title repeated). LinkedIn also uses this as a relevance signal. It takes 30 seconds to add and has zero downsides.

Here's the complete meta tag block for a perfectly-configured link preview:

<!-- Complete link preview meta tags -->
<title>Your SEO Title — Your Site Name</title>
<meta name="description" content="Your SEO description (150-160 chars)">
<link rel="canonical" href="https://yoursite.com/page">

<!-- Open Graph (Facebook, LinkedIn, Slack, WhatsApp) -->
<meta property="og:type" content="article">
<meta property="og:url" content="https://yoursite.com/page">
<meta property="og:title" content="Your Click-Worthy Social Headline">
<meta property="og:description" content="Short, compelling description (under 200 chars).">
<meta property="og:image" content="https://yoursite.com/og/page-1200x630.png">
<meta property="og:image:width" content="1200">
<meta property="og:image:height" content="630">
<meta property="og:image:alt" content="Descriptive alt text for the image">
<meta property="og:site_name" content="Your Site Name">

<!-- Twitter Card -->
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:title" content="Your Click-Worthy Social Headline">
<meta name="twitter:description" content="Short, compelling description.">
<meta name="twitter:image" content="https://yoursite.com/og/page-1200x630.png">
<meta name="twitter:image:alt" content="Descriptive alt text for the image">

6. Link Preview Checker — Test Your Links Before You Share

There's no substitute for testing your link previews before publishing. Different platforms render previews differently, and an issue that looks fine on Facebook might break completely on LinkedIn. Manually testing on each platform is slow and requires you to post publicly or use developer tools. There's a better way.

🔍 Test Your Link Preview — share-preview.com

Paste any URL and instantly see accurate, side-by-side previews for Facebook, Twitter/X, LinkedIn, Slack, and WhatsApp — all on one screen. Plus a complete OG tag diagnostic showing exactly what's missing, broken, or truncated. No signup required.

Test Your Link Preview Free →

share-preview.com is purpose-built for this use case. It simulates how each platform renders your link, checks your OG tags for completeness and validity, verifies your image URL loads correctly, and flags truncation issues — all in a single paste. It's the fastest way to get your link previews right before sharing.

Related tools: the Open Graph protocol guide explains every OG tag in detail, and our complete OG tags reference has every property with code examples.

7. Frequently Asked Questions

What is a link preview?

A link preview (also called a link unfurl or social card) is the box that appears when you share a URL on social media or messaging apps. It typically shows a title, description, and image pulled from the linked page. Platforms generate these previews by sending a bot to crawl the URL and reading Open Graph meta tags from the page's HTML head. Well-configured link previews dramatically improve click-through rates compared to plain URL strings.

Why doesn't my link show a preview?

The most common reasons a link preview doesn't appear are: (1) missing Open Graph meta tags (og:title, og:description, og:image, og:url), (2) the og:image URL is broken, returns an error, or uses a relative path instead of an absolute HTTPS URL, (3) your page is blocked by robots.txt or requires a login to access, (4) the image is too small (LinkedIn requires at least 1200×627px), or (5) the platform's cached version is outdated and showing stale data. Check your OG tags first, then verify the image URL works, then test with share-preview.com.

How do I force Facebook to update my link preview?

Go to the Facebook Sharing Debugger at developers.facebook.com/tools/debug, paste your URL, and click "Scrape Again". This forces Facebook to re-crawl your page and update its cached preview. After scraping, the new preview should appear within a few minutes. If the old image still shows in posts that were already shared, those are cached at the post level and won't update — only new shares will show the updated preview.

How do I check my link preview before posting?

Use share-preview.com — paste your URL and instantly see accurate previews for Facebook, Twitter/X, LinkedIn, Slack, and WhatsApp all on one screen. This lets you catch problems (broken images, truncated titles, missing descriptions) before your link goes live. It's much faster than checking each platform individually and works for pages that haven't been publicly shared yet.

✅ Test Your Link Preview — Free, No Signup

See exactly how your link will look on Facebook, LinkedIn, Twitter/X, Slack, and WhatsApp before you share it. Catch broken images and missing tags before they cost you clicks.

Test Your Link Preview Free →

See How Your Page Looks When Shared

Test your OG tags across Twitter, LinkedIn, Facebook, Slack, and WhatsApp instantly.

Test Share Preview Free →