OG images
How to Fix Facebook Link Previews (Open Graph for Facebook)
July 16, 2026 · 8 min read · Grabbit Team

When you share a link on Facebook, it should generate a card with a title, a description, and an image. When it shows up bare, or with the wrong image, or with no image at all, the cause is almost always on the page you linked: it is missing the Open Graph tags Facebook reads, the og:image is unreachable, or Facebook cached an older version of the page before you fixed the tags. This guide covers the fix, including the cache re-scrape step people miss and how to give the card a real image of your page.
Facebook created the Open Graph protocol, so it is the canonical surface for these tags. Getting them right here fixes the preview on LinkedIn, X, WhatsApp, Discord, and iMessage at the same time, because they all read the same tags.
First, disambiguate what you are trying to do
Two different things get searched as "Facebook link preview," and only one of them is a fix on your page:
- You are sharing your own link and the card is broken or missing an image. That is an Open Graph problem on the page you are sharing. This guide is for you.
- You want to remove or hide the preview on a post you are composing. That is a Facebook composer setting: paste the URL, wait for the card to generate, then delete the raw URL text from your post (the card stays) or click the small x on the card to drop it. Nothing to do with your page's tags.
The rest of this guide is the first case: making your own links unfurl correctly.
How Facebook builds a link preview
Facebook does not screenshot your page or infer its content. When its crawler (facebookexternalhit) fetches your URL, it reads Open Graph meta tags from the <head>. Those tags drive the entire card:
<meta property="og:title" content="Your Page Title" />
<meta property="og:description" content="A one-line summary of the page." />
<meta property="og:image" content="https://yourdomain.com/og.png" />
<meta property="og:url" content="https://yourdomain.com/page" />
og:title and og:description become the text. og:image becomes the picture. If a page has no Open Graph tags, Facebook falls back to guessing from the page title and the first large image it finds, which is usually wrong or blank. That is what a "broken" preview almost always is: missing or unreadable tags, not a Facebook bug.
One change matters here. As of 2025, Facebook removed the ability to manually edit a link preview's title, description, or image in the composer. The preview now always comes from your Open Graph tags, with no override. That makes correct tags the only lever you have, so it is worth getting them right.
Three details trip people up on Facebook specifically:
- Facebook reads the raw HTML, not the rendered page. Its crawler does not run your JavaScript. If your meta tags are injected client-side (a single-page app that sets them after load), Facebook never sees them. The tags must be in the HTML the server sends.
og:imagemust be an absolute, public URL. A relative path like/og.pngwill not resolve, and an image behind a login or a redirect Facebook cannot follow renders as no image. Use the fullhttps://yourdomain.com/og.pngand confirm it loads in a private browser window.- Facebook caches your preview aggressively, and it caches server-side. Once its crawler has scraped a URL, it holds that snapshot. Editing your tags does nothing to an already-cached card until you force a re-scrape. This is the single most common real-world cause of "I fixed it and it still looks wrong," and it has a specific fix below.
How to fix a Facebook link preview
Work through this in order:
- Add the four
og:tags above to the page's<head>, server-rendered. - Set
og:imageto an absolute, public URL that returns an actual image, not an HTML page. - Meet the size minimum. Facebook's docs list 600 by 315 pixels as the minimum for the large full-width card; below that you get a small square thumbnail. Use 1200 by 630 (the 1.91 to 1 ratio) for a crisp large card.
- Confirm the tags are in the served HTML. View source on the live URL (or
curlit) and check the tags are present before any JavaScript runs. - Run the Sharing Debugger and click Scrape Again. This is the step people miss. It is the next section.
The one part that is more work than typing four meta tags is producing the image itself, especially if you want it to reflect the actual page rather than a generic logo.
Making the og:image a real render of your page
For a marketing page, a docs page, or a launch announcement, the best preview image is often a clean shot of the page itself. You can produce that with a screenshot API: point it at the URL, get back a hosted image, and use that image as your og:image.
curl https://api.grabbit.live/v1/grabs \
-H "Authorization: Bearer sk_live_..." \
-H "Content-Type: application/json" \
-d '{
"url": "https://yourdomain.com/og",
"width": 1200,
"height": 630,
"format": "png",
"delay_ms": 500
}'
The response includes a hosted image_url:
{
"id": "grb_01jx...",
"status": "done",
"image_url": "https://cdn.grabbit.live/grabs/grb_01jx....png",
"width": 1200,
"height": 630,
"format": "png",
"bytes": 96540,
"execution_ms": 1240
}
width accepts 320 to 1920 and height 240 to 1080, so the 1200 by 630 card is in range. format accepts png, jpeg, or webp; png is a safe default for Facebook, and jpeg keeps a photo-heavy card smaller. delay_ms (0 to 10000) gives client-rendered content or web fonts a moment to settle before the capture fires. Drop the returned image_url into your tag:
<meta property="og:image" content="https://cdn.grabbit.live/grabs/grb_01jx....png" />
Capture once per unique page and cache the image_url alongside the page record rather than rendering on every request. A common pattern is to build a dedicated /og route with your normal components, capture that, and reuse the result everywhere. The same template-and-cache approach is covered in how to generate dynamic OG images from any URL.
The upside of one correct og:image is reach: Facebook, LinkedIn, X, WhatsApp, Discord, and iMessage all read the same 1200 by 630 Open Graph image, so a single tag fixes the preview everywhere at once. What differs per platform is how you refresh the cache, and Facebook's is the most important to get right.
Bust Facebook's cache with Scrape Again
Facebook caches the scraped version of your page server-side, so unlike WhatsApp there is one authoritative fix that works for everyone at once: the Sharing Debugger.
- Go to
developers.facebook.com/tools/debug. - Paste your page URL and click Debug.
- Facebook shows the
og:title,og:description, andog:imageit currently reads, along with any warnings (a missing image, a redirect, an image that is too small). - Click Scrape Again. Facebook fetches the page fresh and rebuilds the preview from your current tags.
That Scrape Again click is what actually updates the card. Because Facebook's cache is shared, once you re-scrape, everyone who shares the link from then on gets the corrected preview, no per-person cache-busting needed the way WhatsApp requires.
The debugger doubles as your verification tool. If it shows the wrong tags after a Scrape Again, the problem is on the page (tags not server-rendered, wrong image URL), not in Facebook's cache. If it shows the right tags but warns the image could not be fetched, your og:image URL is unreachable or too heavy.
Why your preview still is not showing
If the tags are present, the image URL works in a browser, and you have run Scrape Again but the card still looks wrong, run through these:
- The image is under 600 by 315. Below Facebook's minimum you get a small square thumbnail instead of the large card. Use 1200 by 630.
- The image is behind auth or a redirect. If
og:imagerequires a login, sits behind a paywall, or redirects in a way Facebook will not follow, the card renders without an image. Test the raw image URL in a private window. - Tags are set by JavaScript. Facebook's crawler reads static HTML and does not execute scripts. Server-render the meta tags.
- You edited the tags but did not re-scrape. Facebook is holding the old snapshot. Run Scrape Again in the Sharing Debugger; nothing updates without it.
Work top to bottom: confirm the image meets the size minimum, then confirm the image is public, then confirm the tags are server-rendered, then re-scrape.
The short version
A Facebook link preview is just your page's Open Graph tags, rendered as a card. Add og:title, og:description, og:image, and og:url server-side; make og:image an absolute, public URL at 1200 by 630 (600 by 315 minimum); then run Scrape Again in the Facebook Sharing Debugger to bust Facebook's cache. If you want the image to be a real render of the page instead of a static logo, a screenshot API turns the live URL into the hosted image you point og:image at. The same approach fixes LinkedIn link previews and WhatsApp link previews, and if you are new to the format, start with what is an OG image.
FAQ
- How do I get Facebook to show a link preview?
- Add Open Graph tags to the page's HTML head: og:title, og:description, og:image, and og:url, server-rendered so Facebook's crawler sees them in the raw HTML. Make og:image an absolute https URL that is publicly reachable, at least 600 by 315 pixels (1200 by 630 recommended). Then paste the URL into the Facebook Sharing Debugger at developers.facebook.com/tools/debug, click Debug, and click Scrape Again so Facebook fetches the current tags instead of a cached version.
- Why isn't my Facebook link preview working?
- The most common causes are on the page you are sharing, not on Facebook. Either the page has no og:image, the og:image points at a relative or unreachable URL, the tags are injected by JavaScript that Facebook's crawler does not run, or Facebook cached an earlier version of the page before you added the tags. Facebook's cache is the top real-world cause of a stale or missing preview: even after you fix the tags, the old card sticks until you force a re-scrape in the Sharing Debugger.
- How do I change my Facebook link preview image?
- As of a 2025 change, Facebook no longer lets you manually edit a link preview's title, description, or image in the composer. The preview is always pulled from the page's Open Graph tags. To change the image, update the og:image meta tag in the page's HTML to an absolute https URL of the image you want, then run Scrape Again in the Facebook Sharing Debugger to refresh Facebook's cache. Editing the tag alone will not update a preview Facebook has already cached.
- What size should a Facebook link preview image be?
- Facebook's documentation lists a 600 by 315 pixel minimum to get the large full-width card; below that you get a small square thumbnail. Use 1200 by 630 (the standard 1.91 to 1 Open Graph ratio) for a crisp large card. The same 1200 by 630 og:image also works for LinkedIn, X, WhatsApp, Discord, and iMessage, so one image covers every platform.
- How do I use the Facebook Sharing Debugger?
- Go to developers.facebook.com/tools/debug, paste your page URL, and click Debug. Facebook shows the og:title, og:description, and og:image it currently reads, plus any warnings. If the preview is wrong, click Scrape Again to force Facebook to fetch the page fresh and rebuild the card from your current tags. The debugger is also the fastest way to confirm your tags are server-rendered, since it reports what the crawler actually sees.
Capture any website with one API call
Get a free test key and capture your first screenshot in two minutes.
Written by
Grabbit Team
Screenshots as a service
The team behind Grabbit, the screenshot API for developers and AI agents. We write about web capture, rendering, and automating screenshots at scale.
Keep reading

How to Fix LinkedIn Link Previews (Open Graph for LinkedIn)
Why your LinkedIn link shows up bare or with the wrong image, and how to fix it: add the right Open Graph tags, point og:image at a real 1200x627 render, and force LinkedIn to re-scrape with Post Inspector.
Jun 24, 2026 · 7 min read

How to Fix WhatsApp Link Previews (Open Graph for WhatsApp)
Why your link shows up bare in WhatsApp, and how to fix it: add the right Open Graph tags, point og:image at a real render of your page, keep the image under 600KB, and re-send to bust WhatsApp's per-device cache.
Jul 9, 2026 · 8 min read

Open Graph Debugger: How to Fix a Broken Link Preview
Use an Open Graph debugger to fix a broken link preview. Read the Facebook, LinkedIn, and X validators, force a re-scrape to clear a stale cache, and generate a correct og:image.
Jul 8, 2026 · 6 min read