OG Tags Not Working? 10 Reasons and How to Fix Each One
Open Graph tags present in your HTML but social previews still broken? Here are the 10 most common reasons og:image, og:title, and og:description fail — and how to fix each one.
The diagnosis framework
Before debugging, establish the facts: view your page source (not DevTools — the raw HTML response) and check whether the OG tags are actually present. Then use a preview tool to confirm what the social crawler sees. Most “OG tags not working” problems fall into three buckets:
- Tags are absent or malformed in the HTML.
- Tags are present but the image/URL is unreachable.
- Tags are correct but the platform has cached stale data.
The 10 most common reasons OG tags fail
1. Tags are rendered by JavaScript (not in static HTML)
Social crawlers do not execute JavaScript. If your framework renders OG tags via React, Vue, or Angular client-side hydration, crawlers see a blank head. Fix: use server-side rendering (SSR) or static generation so tags are in the initial HTML response.
2. Relative image URLs
og:image must be an absolute URL: https://yourdomain.com/og.jpg. Relative paths like /og.jpg are invalid in the OG spec and rejected by most crawlers.
3. Image is not publicly accessible
If your image is behind authentication, on a private S3 bucket, or blocked by firewall rules, crawlers cannot fetch it. Test: open the image URL in an incognito window. If you hit a login page, fix your image hosting.
4. Platform cache has stale data
Social platforms cache OG data aggressively. Even after you fix your tags, platforms may show old previews for hours or days. Use each platform's debugger to force a refresh: Facebook Sharing Debugger, LinkedIn Post Inspector, Twitter Card Validator.
5. Wrong property attribute
OG tags use property= not name=. A common mistake: <meta name="og:image" ...> is silently ignored. Correct form: <meta property="og:image" ...>. (Twitter tags use name= — those are correct.)
6. Duplicate OG tags
If your page has two og:image tags (one from your CMS plugin, one from your theme), crawlers typically use the first one — which may be the wrong one. Search your page source for og:image and confirm there is only one.
7. Image dimensions too small
Images under 200×200 px are ignored by Facebook and LinkedIn. Images under 300 px wide are shown as tiny thumbnails on Slack. Use 1200×630 px for full-width card previews everywhere.
8. Wrong Content-Type for the image
If your image is served with Content-Type: application/octet-stream instead of image/jpeg or image/png, some crawlers reject it. Check your CDN or image server headers.
9. Redirect chain on the URL
If your URL redirects (e.g., HTTP → HTTPS, trailing slash normalization, custom short links), make sure the final destination after all redirects still contains the OG tags. Redirects do not inherit metadata from the source URL.
10. Robots.txt blocking the crawler
If your robots.txt blocks all bots (User-agent: * / Disallow: /), social crawlers cannot fetch your page or images. Check your robots.txt and ensure social preview bots are not excluded.
The minimal valid OG tag set
<meta property="og:title" content="Your Page Title" /> <meta property="og:description" content="Your page description." /> <meta property="og:image" content="https://yourdomain.com/og.jpg" /> <meta property="og:image:width" content="1200" /> <meta property="og:image:height" content="630" /> <meta property="og:url" content="https://yourdomain.com/your-page" /> <meta property="og:type" content="website" /> <meta name="twitter:card" content="summary_large_image" />
Not sure which of these 10 issues is affecting your page? Paste your URL into OG Fixer for an instant scan — it checks all tags, validates the image URL, and shows you the live preview across platforms.