Social Preview Tool

Not sure how your link will look when someone shares it?

When a page is posted on a social network, the network builds a card from the page's Open Graph data: a picture, a headline, a line of description and the domain. If those tags are missing or badly written, the card looks broken or bland. This preview lets you try out that content before you commit it to your templates. Type the four values and two mock cards, one styled like Facebook and LinkedIn and one like X, change with each keystroke. The tool runs locally and never visits the page you describe.

Step by step

1. Write a share headline in the first box. It can differ from your SEO title if a shorter, punchier line suits social feeds.
2. Write the supporting sentence in the description box, putting the key point early, because the mock cards stop after 100 characters.
3. Enter the destination address. Only the host name appears on the cards.
4. Paste the full address of the share image, for example a 1200 by 630 pixel landscape graphic. Your browser downloads it directly from that address for the preview.
5. When you are happy, copy the values into og:title, og:description, og:url and og:image tags on the page, plus twitter:card if you want to choose the X card style.

What to watch for

This is a visual approximation, not a copy of any network's renderer. Pictures are scaled and cropped to fill a short box of fixed height, so framing will differ from the live card. Headlines are shown in full even when a network would trim them. If the image does not appear, the address may be wrong or the host may block loading from other sites. Clearing the image box does not remove a picture already shown, so reload to start fresh.

Questions people ask

Does this read the tags already on my page?

No. It only reflects what you type. To see what a network actually pulls from a live URL, use that network's own inspection tool, such as the Sharing Debugger from Meta or the Post Inspector from LinkedIn.

I changed my og:image but the old picture still shows. Why?

Social platforms cache link data. Ask them to scrape the page again with their debugging tools, and consider giving the new image a new filename so no cached copy is reused.

Do I need separate Twitter tags?

Not always. X uses Open Graph values for the title, description and image when its own tags are absent, though its documentation still asks for a twitter:card tag to set the card type.

Further reading: Title Tags and Meta Descriptions: The Complete Guide and Meta Description.

The same tool is also published on the static mirror at seoprocheck.github.io, and the rest of the set is on the free tools page.