OG image not showing? An 8-point debugging checklist
You added the tag, you uploaded the image, and the link preview still shows a grey box. Before you blame the platform, walk this checklist top to bottom — 90% of broken OG images fail on one of the first three points.
1. The tag is on the page the crawler sees
Platforms read the server-rendered HTML of the URL you share. If your tags only appear after JavaScript runs (client-side routing, a modal, an SPA view), most crawlers never see them. View source — not DevTools — and search for og:image. If it's not in the raw HTML, that's your bug.
2. The URL is absolute, not relative
og:image requires an absolute URL. content="/cover.png" silently fails on most platforms.
3. The image is publicly fetchable
Open the image URL in an incognito window. If it needs a login, sits behind a firewall, or returns 403/404 to non-browser agents, the crawler gets nothing. Watch out for hotlink protection and signed URLs that expire.
4. Size and format are in range
- Recommended: 1200×630 (1.91:1 ratio)
- Minimum: 200×200 px; maximum file size ~5 MB (8 MB on X)
- Format: PNG, JPEG, WebP or GIF (static)
5. The platform cached an old version
Every platform caches link previews aggressively. After fixing anything above, force a re-scrape:
- Facebook/WhatsApp: Sharing Debugger → Scrape Again
- X/Twitter: Card Validator
- LinkedIn: Post Inspector
6. Only one og:image set wins
If your framework emits its own og:image (default page metadata) and you add another, you have two tags — crawlers pick the first. Deduplicate.
7. Redirect chains break it
If your share URL redirects (http→https, non-www→www, UTM rewrites), some crawlers follow the chain and drop the tags at the hop. Point shares at the final canonical URL directly.
8. PNG isn't actually a PNG
Renaming a file doesn't change its type — and a mislabelled MIME type (served as text/html) fails validation. Check the Content-Type response header; it should be image/png or image/jpeg.
The never-broken option
OtterSnap's OG Image API returns correctly-sized, correctly-typed PNGs on a stable URL with proper headers — so point 3 through 8 never apply. Generate your first card free on the pricing page.