AI AI Tools Guidebook
Troubleshooting

OG Image Not Appearing on Social Shares

Share to LinkedIn / X / Slack and no image shows — meta tag, image size, or cache.

Published: Author: AI Productivity Guide Team 🌐 查看中文版本

You paste a URL into LinkedIn / X / Slack / Telegram and the preview card either renders without an image or shows an old image you replaced weeks ago. OG failures cluster into three groups: meta tags written incorrectly (usually a relative path), the image itself not meeting platform requirements (size, format, file size), or the social platform serving a cached 24-hour-old crawl. This article ranks 5 hit-rate-sorted causes and gives a fix path from debugger inspection to forced re-scrape.

Common causes

Ordered by hit rate, highest first.

1. og:image uses a relative path

Social-media crawlers don’t resolve relative paths — they take whatever string is in content and try to fetch it as-is. <meta property="og:image" content="/og.png"> renders fine in the browser but the crawler gets a string it can’t fetch.

<!-- Wrong: relative path, crawlers fail -->
<meta property="og:image" content="/og/article-slug.png" />

<!-- Right: must be an absolute URL with protocol -->
<meta property="og:image" content="https://yourdomain.com/og/article-slug.png" />

How to spot it: LinkedIn Post Inspector / Facebook Sharing Debugger / opengraph.dev shows the og:image field starting with / instead of https://.

2. Image dimensions / ratio don’t meet platform requirements

Each platform has hard minimum size and aspect ratio rules. Anything below the minimum simply doesn’t render:

PlatformRecommendedMinimumAspect ratio
Facebook / LinkedIn1200×630600×3151.91:1
Twitter / X (summary_large_image)1200×628300×1572:1
Slack1200×630600×600loose
WeChatany, prefers 5:4300×300—

Anything narrower than 600px will fail on most platforms.

How to spot it: Debugger error Image size is too small, or the preview shows only title + description with no image.

3. Social platform cached an old crawl

LinkedIn / Facebook / Twitter cache crawl results for 7–30 days. You updated og:image but shares still show the old one.

How to spot it: Debugger displays “Last scraped: 5 days ago” or similar; new URLs work on first share but updated URLs don’t.

4. Image URL requires auth or has CORS restrictions

og:image points at a CDN that needs a cookie / token / referrer (e.g. signed Cloudinary URLs), or the origin sets Access-Control-Allow-Origin rules that exclude the social crawler’s UA.

How to spot it:

curl -A "facebookexternalhit/1.1" -I "https://yourdomain.com/og/article.png"
# Expect 200 + image/png; a 403 / 401 / redirect to login means it's gated

5. File format / size out of bounds

GIF / SVG / WebP aren’t universally supported; files over 5MB get dropped (Facebook caps at 8MB, LinkedIn 5MB, Twitter 5MB).

ls -lh og.png   # expect < 1MB; over 3MB risks being rejected
file og.png     # expect PNG image data or JPEG image data

How to spot it: Debugger reports Unsupported image format or Image too large.

Shortest path to fix

Use each platform’s debugger to see exactly what the crawler is receiving, then fix targetedly.

Step 1: Run the page through each platform’s debugger

PlatformURL
Facebookhttps://developers.facebook.com/tools/debug/
LinkedInhttps://www.linkedin.com/post-inspector/
Twitter / XLegacy Card Validator is gone; use https://opengraph.dev
TelegramDM @WebpageBot and send the URL

Paste your URL, then check:

  1. Is og:image an absolute URL?
  2. Is the previewed image correct?
  3. Are there any error messages?

Step 2: Verify the meta tags are complete and absolute

Minimum viable set:

<meta property="og:title" content="Article title" />
<meta property="og:description" content="One-sentence summary" />
<meta property="og:image" content="https://yourdomain.com/og/article.png" />
<meta property="og:image:width" content="1200" />
<meta property="og:image:height" content="630" />
<meta property="og:url" content="https://yourdomain.com/articles/article-slug/" />
<meta property="og:type" content="article" />

<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:image" content="https://yourdomain.com/og/article.png" />

In Astro / Next.js, force absolute URLs with a helper:

// src/lib/og.ts
const SITE = import.meta.env.PUBLIC_SITE_URL ?? "https://yourdomain.com";
export const absoluteOg = (path: string) =>
  path.startsWith("http") ? path : `${SITE}${path.startsWith("/") ? "" : "/"}${path}`;

Step 3: Confirm the crawler can actually fetch the image

# Pull as the Facebook crawler
curl -A "facebookexternalhit/1.1 (+http://www.facebook.com/externalhit_uatext.php)" \
  -I "https://yourdomain.com/og/article.png"

# Expect:
# HTTP/2 200
# content-type: image/png
# content-length: < 5000000

A 403 / 401 / 302 means auth or routing is blocking the crawler. Make the path public (whitelist the crawler UA at the CDN, or move the image into the static public/ directory).

Step 4: Force a re-scrape

Every debugger has a “Scrape again” / “Re-scrape” / “Refresh” button:

  • Facebook Debugger: paste URL → “Debug” → “Scrape Again”
  • LinkedIn Post Inspector: paste URL → auto-rescrapes (cache ~7 days)
  • Twitter (opengraph.dev): paste URL → “Refresh”
  • Telegram: DM @WebpageBot the URL, hit “refresh” in the reply

For bulk refreshes, script the Facebook Graph API ?scrape=true:

curl -X POST "https://graph.facebook.com/?id=https://yourdomain.com/articles/foo&scrape=true&access_token=$FB_TOKEN"

Step 5: Re-export the image to spec if it’s the wrong size

Export at 1200×630 PNG or JPEG, target 300KB–1MB:

# ImageMagick one-liner
convert input.png -resize 1200x630^ -gravity center -extent 1200x630 -quality 85 og.png

# Or sharp (Node.js)
npx sharp-cli -i input.png -o og.png resize 1200 630 --fit cover

Avoid SVG (poor support) and GIF (animated frames usually pick an ugly still).

Prevention

  • Standardize on 1200×630 PNG/JPG OG images, file size under 1MB; avoid SVG / GIF / WebP.
  • Use a helper to coerce og:image and og:url to absolute URLs so per-article authors can’t get it wrong.
  • Add a CI check that curl -A facebookexternalhit ... fetches each new article’s og:image and asserts 200 + correct content-type.
  • After publishing, immediately trigger a scrape in the Facebook and LinkedIn debuggers so the default 30-day cache doesn’t block early shares.
  • Auto-generate OG images from the article title (@vercel/og, satori, puppeteer) so “forgot to add an image” can’t happen.

Tags: #Hosting #Debug #Troubleshooting #SEO

Related Articles