ScreenshotNeo

BlogHow-to

How to Stop Facebook from Choosing the Wrong Image for a Link Preview

Set the right og:image, check what Facebook can read, and refresh the shared preview. This guide covers duplicate tags, crawler access, stale previews, and fixes.

By the ScreenshotNeo team4 October 20266 min read

Set the intended image in the page’s og:image metadata, check the HTML Facebook can retrieve for the exact URL you are sharing, then use Meta’s Sharing Debugger to inspect and refresh its scrape. Refreshing a preview does not fix incorrect page metadata. If Facebook reads an unintended image, correct the page first and scrape again.

1. Set the page’s Open Graph image

Open Graph metadata goes in the document’s <head>. The protocol defines og:title, og:type, og:image, and og:url as its four required basic properties. og:image identifies the representative image for the page; og:url identifies its canonical URL. See the Open Graph protocol.

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>A useful article</title>
  <meta property="og:title" content="A useful article">
  <meta property="og:type" content="article">
  <meta property="og:url" content="https://example.com/articles/a-useful-article">
  <meta property="og:image" content="https://example.com/images/a-useful-article-cover.jpg">
  <meta property="og:image:alt" content="A description of the article cover">
</head>
<body>
  <h1>A useful article</h1>
</body>
</html>

Replace the example URL and image with the page and image you intend to share. The image URL should be an absolute, publicly retrievable URL. The protocol also defines optional image metadata such as width, height, MIME type, secure URL, and alt text. Add accurate values when useful; this guide does not claim a particular dimension or file-size threshold is a current Meta requirement.

Check for competing image tags

A page can contain multiple og:image values. Open Graph allows array properties, and its protocol says the first tag in document order is preferred when values conflict. Inspect every occurrence in the delivered HTML. Move the intended image first or remove tags that should not be there.

<!-- If multiple image values are intentional, put the preferred one first. -->
<meta property="og:image" content="https://example.com/images/preferred.jpg">
<meta property="og:image" content="https://example.com/images/alternate.jpg">

Duplicates can come from a theme, a social-sharing plugin, a page-specific SEO setting, or server-side templates that each add their own tags. Fix the source that generates the unwanted value so it does not return on the next page build.

2. Check the exact URL and delivered metadata

  1. Copy the complete URL being shared, including its path and any query string that changes the page. Check that its og:url points to the intended canonical page.
  2. Request that exact URL and inspect the HTML response. Confirm that the head contains the expected og:image, and check all image tags in their document order.
  3. Open the image URL directly without being signed in. Confirm that it returns the intended image and is not blocked by access controls or server behavior.
  4. After changing metadata, publish the page and inspect the response again. Make sure the corrected tags are in the HTML being served, not only in your local template or browser-rendered page.

The key diagnostic difference is between what your browser displays after rendering and what the server delivers in the page HTML. If those differ, the crawler may not see the same image choice you see in the browser. The Open Graph protocol describes og:url as the canonical URL and permanent graph identifier, so mismatched share and canonical URLs are worth checking.

3. Refresh and inspect Facebook’s scrape

Once the page metadata and image are correct and published, submit the exact URL to Meta’s Sharing Debugger. Inspect the values it reports, then request a fresh scrape if the preview still reflects old data. If it reports an unintended image, return to the source HTML and fix that value before scraping again.

The debugger workflow is based on a reviewed third-party troubleshooting guide. The current Meta debugger page could not be verified for this article, so check Meta’s tool itself for current interface labels and access requirements. A fresh scrape is a verification step; it cannot correct bad metadata or make an inaccessible image available.

4. Troubleshoot the cause, not just the preview

Symptom Likely cause Fix
Facebook shows a different image than the page owner chose An earlier og:image value, or a template or plugin adding a competing value Inspect every tag in the delivered head. Put the intended value first or remove the unwanted tags, publish, then scrape again.
The browser shows the right image but the debugger does not The delivered HTML may differ from browser-rendered markup, or crawler access to the page or image may be restricted Inspect the raw HTML response for the exact shared URL. Check that both the page metadata and image can be retrieved publicly.
The preview still shows an old image after a change The updated page may not be published or served yet, or the tool may still be showing a previous scrape Verify the current response contains the new value, then submit the exact URL and request a fresh scrape.
The intended image URL fails when opened directly The file may be missing, private, blocked, or served incorrectly Fix the image URL or its access and server response. Confirm it resolves to the intended image before refreshing the page scrape.
The debugger reports metadata for an unexpected page The shared URL and og:url may refer to different pages or canonical URLs Check redirects and canonical metadata. Align the share URL and page metadata with the page you intend people to preview.

Do not treat a successful refresh as proof that the page source is now correct. Recheck both the delivered metadata and the image URL if the wrong preview returns later.

5. Keep previews reliable as the page changes

  • Set metadata per page. Ensure each page has the representative image it should share rather than inheriting an unrelated site-wide image.
  • Keep the image address usable. Avoid relying on an image URL that requires a visitor login or other access the crawler may not have.
  • Check the published response after deployments. A corrected CMS field is not enough if a stale template or another plugin still emits a conflicting tag.
  • Recheck after changing canonical URLs or image paths. Those changes can make previously correct metadata point to a different page or an unavailable file.

There is no browser automation required for the core fix: the important evidence is the metadata and image the crawler can retrieve. A screenshot can help visually inspect a page, but it cannot tell you which Open Graph value was selected unless you also inspect the page metadata.

Or skip the browser setup

If you need a visual capture of the page while investigating, ScreenshotNeo is a website screenshot API and MCP server. Its one-call API returns an image or PDF, and its documentation describes the available capture options. This does not replace inspecting Open Graph tags or refreshing Facebook’s scrape.

curl -G "https://api.screenshotneo.com/v1/shot" -d access_key=YOUR_API_KEY --data-urlencode url=https://example.com/articles/a-useful-article -o shot.webp
import requests

r = requests.get(
    "https://api.screenshotneo.com/v1/shot",
    params={
        "access_key": "YOUR_API_KEY",
        "url": "https://example.com/articles/a-useful-article",
    },
    timeout=90,
)
r.raise_for_status()
open("shot.webp", "wb").write(r.content)
const q = new URLSearchParams({
  access_key: 'YOUR_API_KEY',
  url: 'https://example.com/articles/a-useful-article',
});
const res = await fetch(`https://api.screenshotneo.com/v1/shot?${q}`);
if (!res.ok) throw new Error(`Screenshot request failed: ${res.status}`);
const image = Buffer.from(await res.arrayBuffer());
await import('node:fs/promises').then(fs => fs.writeFile('shot.webp', image));

ScreenshotNeo accepts cookie or consent banners like a visitor and removes more than 60 known consent platforms, newsletter popups, and chat widgets before capture; each step can be turned off. Bot checks, blank pages, timeouts, failed loads, and cache hits are not billed, and response headers report the page verdict and billing status. Its MCP server offers screenshot and page-info tools for AI agents. The free plan includes 1,000 screenshots per month with no card; paid plans start at $5 for 3,000. Sign up for 1,000 free screenshots a month, with no card required.

FAQ

Should I share the image URL instead of the page URL?

No. The preview metadata belongs on the page URL you share. Set that page’s og:image to the image address.

Does refreshing the scrape edit my website?

No. Change the page metadata and publish it on your site; use the debugger to inspect and refresh the scraped preview.

Can a screenshot tell me what Facebook read?

A screenshot shows rendered pixels. Inspect the HTML metadata and the debugger’s reported values to diagnose the selected Open Graph image.