PreviewChecks

Open Graph tags: an HTML example and practical checks

Add Open Graph metadata to the HTML your server sends, then check the same public URL. This example shows the four protocol-required properties and useful optional fields. The checks below help separate missing metadata from an image or crawler access problem.

Start with the four required properties

Each page needs a title, type, image URL and canonical object URL. A description is optional but recommended. Use a type that matches the page, such as website for a general page or article for editorial content. 

<head>
  <title>Herbs for a Small Balcony</title>
  <link rel="canonical" href="https://example.com/guides/balcony-herbs">
  <meta name="description" content="A practical guide to growing herbs on a small balcony.">
  <meta property="og:title" content="Herbs for a Small Balcony">
  <meta property="og:type" content="article">
  <meta property="og:url" content="https://example.com/guides/balcony-herbs">
  <meta property="og:description" content="A practical guide to growing herbs on a small balcony.">
  <meta property="og:image" content="https://example.com/images/balcony-herbs.jpg">
</head>

Replace the example values with information from the page visitors will open. Keep the ordinary HTML title, description and canonical link accurate too. Use absolute HTTPS URLs for og:url and og:image.

Describe the image you actually publish

The protocol allows optional image properties for MIME type, width, height and alternative text. Add them after the og:image they describe. Use the delivered file's format and decoded dimensions, and write alt text that describes the image rather than repeating the page title. 

<meta property="og:image" content="https://example.com/images/balcony-herbs.jpg">
<meta property="og:image:type" content="image/jpeg">
<meta property="og:image:width" content="1200">
<meta property="og:image:height" content="630">
<meta property="og:image:alt" content="Pots of herbs on a small balcony">

If you publish multiple image URLs, keep each image's properties with its root tag. The first declared image has preference when repeated values conflict. See the image order guide for examples, and the image size guide for dimensions and crop.

Put the tags in the delivered page head

Place these tags inside the document <head>. Check the initial HTML response, not only the browser's Elements panel: client-side code can add metadata after the document loads, which may be too late for a crawler reading the response.

PreviewChecks flags metadata placed beyond its first 64 KB as a conservative reliability warning. That is an early placement check, not a universal platform limit. Meta's crawler documentation describes how its crawler reads Open Graph properties.

Check the public page in order

  1. 1. Check the final page URL

    Run the public URL through PreviewChecks. Confirm that the report sees the title, description, canonical URL and first image you intended to publish.

  2. 2. Open the selected image directly

    Follow redirects and check the final status, MIME type, bytes and decoded dimensions. A correct tag cannot fix a private image URL or an HTML error page. The image size guide explains the difference between declared dimensions and the returned file.

  3. 3. Compare a regular request with crawler-like checks

    If the page works in your browser but metadata is missing from the response, render it in the server-delivered head. If crawler-like requests receive a challenge, block or different page, inspect the matching WAF or bot rule. The crawler access guide explains this check.

    These diagnostic requests use common crawler user agents from PreviewChecks infrastructure. Verify real platform traffic in your server or WAF logs.

If the platform still shows an old card

Confirm the live page and image are current, then use an official platform inspector when one is available. The Facebook Sharing Debugger can request a fresh Facebook scrape. PreviewChecks cannot clear a platform cache, verify the platform's private fetch path or update a post that was already published. For X metadata checks, use the focused Twitter/X validator.

Check a public URL

Primary references

Reviewed .