Open Graph preview
Enter a page and this tool shows a preview of the card people see when your link is shared, along with the Open Graph and Twitter tags behind it. It flags any required tag that’s missing.
It’s for anyone about to post a launch link and wanting to see it first. The tags are read from your page’s raw HTML, which is what link-preview bots generally read, so a tag added by JavaScript may not show here.
Free with a ShipScroll account.
How to use the Open Graph Preview
- Paste the exact link you plan to share.
- Press Preview link and look at the card.
- Add or fix any tags the notes mention, then deploy.
- Check again after ten minutes, when the saved result has expired.
The four required tags
The Open Graph protocol asks every page to set these four:
| Tag | What it’s for | Example |
|---|---|---|
| og:title | The name to show | Acme: invoices in one click |
| og:type | The kind of thing it is | website, article |
| og:image | The image to show, as a full URL | https://example.com/share.png |
| og:url | The page’s canonical address | https://example.com/pricing |
Make the image work everywhere
- Use a full https address. A path like /share.png often won’t load for bots.
- Make it wide. 1200×630 pixels is a common choice that most networks display well.
- Keep important text away from the edges, since networks crop cards differently.
- Check the image opens without a login, and that your CDN doesn’t block bots.
Why a shared link still shows the old card
Social networks and chat apps store a copy of your card the first time a link is shared, so a fix on your site may not show up there straight away. Most networks offer a way to refresh it, and adding a small query string to the link makes them treat it as new. This preview reads your live page, so it’s the quickest way to confirm the fix itself worked.
Questions
What’s the difference between Open Graph and Twitter cards?
Open Graph is a general protocol that many platforms read. Twitter card tags, such as twitter:card, control how links appear on X. X uses Open Graph as a fallback for some values, but set twitter:card yourself to choose the large image layout.
Will this look exactly the same on every network?
No. Each network has its own layout, cropping and text limits. This preview is a close approximation that uses your real title, description and image, and it’s good for catching missing or wrong content.
Do Open Graph tags help SEO?
They’re for how your link looks when shared, and search rankings aren’t what they control. A good card can get more people to click a shared link, which is a good enough reason on its own to set them.
My image shows “didn’t load”. What should I check?
Open the image address in a private window. If it needs a login, gives a 404, or is blocked, bots will fail as well. Also check it’s a full URL starting with https, not a relative path.
Related tools
- Meta Tags CheckerSee the title, description, canonical and share tags a page actually serves.
- On-Page SEO AuditOne report on a page’s title, headings, images, links, schema and robots.txt.
- UTM BuilderBuild campaign links with consistent UTM tags, so analytics credits the right source.