Facebook / LinkedIn Share Preview
How to use the Open Graph Generator
Open Graph is the universal protocol for link-preview cards across social and messaging apps. Without OG tags, your links unfurl as text-only URLs — instantly less clickable.
Set og:type and og:url
Type is "website" for most pages, "article" for blog posts, or "video.movie" for video pages. og:url is the absolute canonical URL of the page.
Add og:title and og:description
These can match your <title> and meta description, or differ if you want a punchier social headline. Aim for 60-char title and 110-char description for full visibility on Twitter, Facebook, and LinkedIn.
Set og:image
1200 × 630 pixels at 1.91:1 ratio. Absolute URL, https only. Stays under 5 MB. PNG or JPG. This is the single highest-leverage tag — preview cards without an image get 5× lower CTR.
Paste into and validate
Use the Facebook Sharing Debugger to scrape the URL — it shows the rendered preview and surfaces missing or invalid tags.
Why Open Graph tags decide whether your link gets clicked
When someone shares your URL on Facebook, LinkedIn, Slack, Discord, or iMessage, the receiving app fetches your page and reads your Open Graph tags to render a preview card. No OG tags = ugly text URL. Good OG tags = an image-rich card that gets clicked.
Where Open Graph is read
- Facebook — primary use case, OG was Facebook's invention.
- LinkedIn — preview cards in posts and messages.
- Slack — link unfurls in DMs and channels.
- Discord — embed cards.
- iMessage / WhatsApp / Signal — preview pills.
- X (Twitter) — falls back to OG when twitter:* tags are missing.
- Pinterest, Reddit, Hacker News — embed cards.
Image is everything
The og:image is responsible for ~80% of link-card click-through. A preview card with no image gets ignored; a preview card with a sharp 1200 × 630 image stops the scroll. Keep the image relevant to the page (not a generic logo) and ensure text inside the image is readable at thumbnail size.
Common failures
- Relative URLs —
og:imagemust be absolute (https://...), not/images/foo.png. - Image too small — under 200 × 200 → Facebook silently rejects.
- Image behind auth — preview crawlers can't fetch private images.
- Cached old preview — Facebook caches aggressively. Use the Sharing Debugger to force re-scrape.
- Missing og:url — links shared with UTM params create duplicate Facebook entries.
Frequently asked questions
What is Open Graph?
Open Graph is a meta-tag protocol introduced by Facebook in 2010 that lets a webpage describe how it should appear when shared on social media. OG tags are read by Facebook, LinkedIn, X, Slack, Discord, iMessage, WhatsApp, and dozens of other apps when generating link-preview cards.
What's the ideal og:image size?
1200 × 630 pixels at 1.91:1 aspect ratio. Facebook displays at this ratio, LinkedIn auto-crops to fit, X (Twitter) accepts up to 4096 × 4096 but renders at 1.91:1. Stay under 5 MB. PNG and JPG both work; PNG is preferred for graphics with text.
Do I need both Open Graph and Twitter Card tags?
No — X (Twitter) falls back to Open Graph when twitter:* tags are missing. The reason to add explicit twitter:* tags is for full control over the card type (summary vs summary_large_image) and to use a different image on X than on Facebook.
Why doesn't my Open Graph image appear?
The most common causes: (1) og:image is a relative URL not an absolute https URL; (2) the image is below 200 × 200 px (Facebook's minimum); (3) the image URL is blocked by robots.txt or auth; (4) Facebook has cached an older version — use the Sharing Debugger to refresh.
Can I have different OG images for different platforms?
Sort of. Facebook reads og:image; X reads twitter:image (falling back to og:image). If you want different images, set both. LinkedIn always reads og:image. There's no way to set a different image specifically for LinkedIn vs Facebook.