How Open Graph tags control your link previews

Open Graph tags are meta tags in a page's head that tell social networks and chat apps which title, image and URL to use when someone shares your link. If they are missing, the preview is a guess and often shows no image. Adding them is a small one-time job, and it is worth doing for any page you expect to be shared.

How to do it

1. Add the four properties the Open Graph protocol requires on every page: og:title, og:type, og:image and og:url. The protocol's own example looks like this:

<meta property="og:title" content="Sample Product" /> <meta property="og:type" content="website" /> <meta property="og:url" content="https://www.example.org/products/sample" /> <meta property="og:image" content="https://www.example.org/images/sample.png" />

2. Add og:description as well. LinkedIn's help page lists og:title, og:image, og:description and og:url as the tags it needs.
3. Make the image fit the strictest network. LinkedIn asks for an og:image of at least 1200 x 627 pixels, a 1.91:1 ratio and a file of 5 MB or less, and shows images under 401 pixels wide as small thumbnails. A 1200 x 630 image is a common size that meets this.
4. Set the image width and height in tags (og:image:width, og:image:height). Facebook says to specify them so the image loads properly the first time it is shared.
5. Use an absolute URL for the image that works without logging in, so crawlers can fetch it. LinkedIn notes that a site blocking its crawler is one reason an image does not show.
6. Add twitter:card set to summary_large_image if you want X to show a large image card. X's older card documentation says to set it to that value. Check X's current docs for image rules.
7. Make each page's tags unique to that page, with its own title, description and image. A template that gives every page the same preview wastes the chance.
8. Test every template once: a blog post, a product page, the home page. Paste the URL into the Facebook Sharing Debugger, LinkedIn's Post Inspector, and send yourself the link in Slack or iMessage.

Tools

On WordPress, an SEO plugin such as Yoast SEO fills in most Open Graph tags from your post data and has a "Social media appearance" section in the editor where you set the share image, title and description per post. Most site builders and frameworks have a setting or a metadata API for the same thing. The Facebook Sharing Debugger shows "which meta tags the crawler scrapes as well as any errors or warnings" and triggers a fresh scrape.

What it looks like in practice

Say you publish a blog post titled "How we cut onboarding from 14 steps to 5". You set og:title to the post title, og:description to a one-sentence summary, and og:image to a 1200 x 630 picture with the title in large text. When a reader pastes the link in LinkedIn, the post appears as a card with that image and title. Without the tags, the network has to guess what to show.

When it backfires

• Stale previews. Networks cache what they scraped. Facebook says images are cached by URL and will not update unless the URL changes, so rename the file when you replace the image, then re-scrape in the debugger.
• Images that do not fit. Text too small to read at thumbnail size, or key content near the edges, gets cropped. Check the preview.
• Mismatch with the page. A preview that promises something the page does not deliver wastes the click.
• Old advice. Validator links in older guides go stale. Use each network's current tool.
• Blocked crawlers. If a login wall, bot protection or robots rules stop the platform's crawler, tags in your HTML will not help.

Questions people ask

What are Open Graph tags? Meta tags that define how a page appears when shared: title, description, image and URL. The protocol was originally created at Facebook.

Do Open Graph tags help LinkedIn previews? Yes. LinkedIn's help page lists the tags it needs and the image size it expects.

Does Open Graph help SEO? Not directly. Its value is better-looking shared links, which can bring more clicks from social and messaging apps.

Sources

• The Open Graph protocol, read Oct 8, 2026
• LinkedIn Help: troubleshooting link previews, read Oct 8, 2026
• Meta for Developers: sharing for webmasters, read Oct 8, 2026
• Yoast: social media optimization with Yoast SEO, read Oct 8, 2026
• X card docs (archived 2014 copy), read Oct 8, 2026
• Facebook Sharing Debugger, read Oct 8, 2026