Open Graph tag possibilities

Open Graph meta tags help platforms build previews when your links are shared. Missing or incomplete sets can lead to wrong images, titles, or descriptions in social apps and messengers.

What we look for

Whether Open Graph tags are present at all.
Whether the core fields we expect for a useful preview are filled (product rules may evolve).

What to do

Add standard tags such as og:title, og:description, og:url, and og:image where applicable, with sizes and formats suitable for major platforms.

Example

A typical Open Graph set in <head> for a product page:

<head>

<meta property="og:title" content="Leather tote bag | Acme Handbags" />
<meta
property="og:description"
content="Handmade tote in full-grain leather. Fits a 13" laptop."
/>
<meta property="og:url" content="https://example.com/products/leather-tote" />
<meta property="og:image" content="https://example.com/media/tote-1200.jpg" />
<meta property="og:type" content="product" />
</head>

Technical details

Evaluation is based on parsed HTML from the crawl. See On-page and technical signals.

When a Twitter tag overrides Open Graph

X uses twitter:title, twitter:description, and twitter:image when those tags are present. When they are absent, X uses Open Graph. A page with no Twitter tags is left alone.

This opens when a Twitter tag is present and the matching Open Graph value is filled, but the Twitter value is empty, or twitter:image is not an http(s) URL, or that image’s first response is 4xx or 5xx (not 403). A timeout is not flagged. The row names the tag, the Twitter value, and the Open Graph value it replaced.

On /products/leather-tote, keep the tote image. Do not override it with an empty Twitter image:

<meta property="og:image" content="https://example.com/media/tote-1200.jpg" />
<meta name="twitter:image" content="" />

<meta property="og:image" content="https://example.com/media/tote-1200.jpg" />
<meta name="twitter:image" content="https://example.com/media/tote-1200.jpg" />