What it does
When someone shares your link, the app they share it in reads a few tags from your page and builds a card: a title, a short description and an image. Those tags are Open Graph tags (og:title, og:image and so on), plus a twitter:card tag for X.
If the tags are missing or wrong, the card looks broken or bare, and people scroll past it. This tool fetches your page, reads its tags, and draws approximate cards for X, LinkedIn and Facebook, Slack, and iMessage, so you can fix problems before the link goes out.
How to use it
- 1Type the page address into the Website or page URL field.
- 2Press Preview the cards.
- 3Look over the four previews to see how the title, description and image sit in each layout.
- 4Read the checks below them. Each tag is marked Pass, Check or Fix, with a note on what's missing.
The tags that make a good card
Five tags cover almost every platform. The tool checks each one.
- og:title: the headline on the card. Without it, platforms fall back to your page title.
- og:description: one or two sentences under the headline.
- og:image: the picture. Use a full https URL, not a relative path like /og.png.
- og:url: the canonical address, so shares of slightly different URLs count as one page.
- twitter:card: set it to summary_large_image if you want X to show a big image instead of a small thumbnail.
Why your card still shows the old version
Platforms cache link cards, often for days. If you fix your tags and the old card keeps appearing, the platform hasn't fetched your page again yet. LinkedIn's Post Inspector and Facebook's Sharing Debugger let you ask for a fresh copy. Changing the image's file name also helps, since a new URL can't be served from cache.
This tool reads the HTML your server sends. If your tags are added later by JavaScript, many platforms won't see them, and this tool won't either. Put them in the server-rendered page.
Questions
What are Open Graph tags?
They're meta tags in your page's head, such as og:title and og:image, that tell social apps and messengers what to show when your link is shared. The format started at Facebook and is now read almost everywhere.
Does X use Open Graph tags?
Yes. X reads its own twitter: tags first and falls back to Open Graph for the title, description and image. You still need twitter:card set to summary_large_image to get the large card.
Why does my link share with no image?
Usually og:image is missing, uses a relative path, points to an image that doesn't load, or the platform cached an old version of the page. The checks on this page flag the first two.
Are the previews exact?
No. They approximate each platform's layout from your tags. Each app crops and trims a little differently, and changes its design from time to time.