OG Image Not Showing in Link Previews

Your page link gets shared on social media and the preview shows no image — just a blank card or a generic placeholder. This is one of the most common Open Graph issues, and it almost always comes down to the image being unreachable, improperly referenced, or cached.

Common Causes

1. og:image tag missing from HTML — The meta tag simply isn't in your page's <head> section.

2. Relative URL instead of absoluteog:image must be a full URL (https://example.com/images/preview.jpg), not a relative path (/images/preview.jpg).

3. Image URL returns 404 or redirect — The URL in the tag points to a file that doesn't exist or redirects to another location. Most crawlers won't follow redirects.

4. Image served over HTTP — Facebook, LinkedIn, Twitter/X, and WhatsApp all require HTTPS. An http:// image URL will be ignored.

5. Image too small — Facebook requires at least 200x200px. LinkedIn needs 1200x627px for a full card. Undersized images get dropped or rendered as tiny thumbnails.

6. Missing og:image:width and og:image:height — Facebook processes images asynchronously. Without explicit dimensions, the first scrape often returns no image. The second scrape works, but by then the post is already live with no preview.

7. OG tags rendered by JavaScript — Social media crawlers do not execute JavaScript. If your meta tags are injected by React, Vue, Angular, or any client-side framework, crawlers see an empty <head>.

8. robots.txt blocking the crawler — If your robots.txt disallows the crawler's user agent (e.g., facebookexternalhit, Twitterbot, LinkedInBot), it can't read your page or fetch the image.

9. Server too slow — Facebook gives your server roughly 4-5 seconds to respond. If the page or image takes longer, the scrape fails silently.

10. Platform cache showing old data — The platform scraped your page before the og:image was added and is still serving the cached (imageless) version.

How to Fix

1. View your page source. Open the page in a browser, right-click, select "View Page Source" (not Inspect Element — you need the raw HTML the server sends). Search for og:image. If it's missing, add it.

2. Verify the image URL loads directly. Copy the full URL from the og:image content attribute and paste it into your browser's address bar. The image should load immediately with no redirects.

3. Confirm the URL is absolute and uses HTTPS. The tag must look like the correct example below, not a relative path.

<!-- Correct: absolute URL with HTTPS -->
<meta property="og:image" content="https://example.com/images/preview.jpg" />

<!-- Wrong: relative path -->
<meta property="og:image" content="/images/preview.jpg" />

4. Add explicit dimensions. Include og:image:width and og:image:height so platforms don't have to fetch the image to determine its size:

<meta property="og:image" content="https://example.com/images/preview.jpg" />
<meta property="og:image:width" content="1200" />
<meta property="og:image:height" content="630" />

5. Run the URL through platform debuggers.

Facebook Sharing Debugger — shows exactly what Facebook's crawler sees.

LinkedIn Post Inspector — shows how LinkedIn will render the card.

Twitter/X — post the URL in a tweet draft or use the Card Validator.

6. Force a re-scrape. In Facebook's Sharing Debugger, click "Scrape Again" (sometimes twice). In LinkedIn's Post Inspector, paste the URL and click "Inspect" — this clears their cache. Wait a few minutes, then re-share.

Platform-Specific Notes

Facebook is the strictest about og:image:width and og:image:height. Without them, the first share almost always fails. Add them even if other platforms don't require them. Minimum size is 200x200px, recommended 1200x630px. Cache duration is approximately 30 days.

Twitter/X falls back to og:image if twitter:image isn't set, but it has its own sizing rules. Minimum 144x144px for summary cards, recommended 1200x628px for large image cards. A 1200x630 image works well across all platforms. Cache lasts about 7 days.

LinkedIn requires at least 200x200px and recommends 1200x627px. Cache duration is approximately 7 days.

WhatsApp has a ~300KB soft limit on image file size. Large images may not load in previews, especially on mobile connections. Minimum 200x200px, recommended 1200x630px.

Prevention Checklist

Use this checklist to make sure your OG images work correctly on every platform:

Every page has an og:image meta tag in the <head>. Image URL is absolute and uses HTTPS. og:image:width and og:image:height are set. Image is at least 1200x630px (covers all platforms). Image file size is under 1MB (under 300KB for WhatsApp). Image URL returns 200 OK with no redirects. Server responds within 3 seconds. robots.txt does not block social media crawlers. OG tags are in the static HTML, not injected by JavaScript. After deploying changes, re-scrape with platform debuggers.

FAQ

Most likely you're missing og:image:width and og:image:height. Facebook fetches images asynchronously on the first scrape. Without dimensions, it doesn't wait for the image. Add the dimensions and click "Scrape Again" twice in the Sharing Debugger.

Facebook caches aggressively. If the link was shared before the image was fixed, the old (broken) preview is locked to that specific post. New shares will use the updated image. Already-shared posts do not retroactively update.

Twitter/X falls back to og:image if twitter:image isn't present. However, setting both gives you control over platform-specific image dimensions. If you use only one image, og:image with a 1200x630 dimension works across all major platforms.

Check Your OG Tags Now

See exactly how your link will look on every platform before you share it.

  • Preview on Facebook, LinkedIn, Twitter/X, WhatsApp, iMessage, and more
  • No sign-up required
  • Live fetch — always see the latest version, no cache