How to Check Open Graph Tags Before Sharing a Page

Learn how to inspect Open Graph and Twitter Card metadata, understand what each field controls and troubleshoot social previews before you share a page.

When you share a web page on a social network or messaging platform, the link can be turned into a rich preview with a title, description and image. Those values are usually supplied by metadata in the page HTML rather than by the visible content alone. A small mistake in the metadata can therefore produce a preview with an old title, a missing image or a description that does not match the page.

What is Open Graph metadata?

Open Graph is a set of metadata conventions that lets a page describe itself to systems that consume links. The most common fields are og:title, og:description, og:image and og:url. A page can also specify og:type and other optional properties.

The four fields to check first

og:title

This is the title intended for the shared link. Keep it specific to the page and make sure it is not accidentally inherited from a generic site title.

og:description

The description gives a short explanation of the page. Check that it describes the actual content and does not contain placeholder copy or unrelated text.

og:image

The image is often the most visible part of a social preview. Verify that the URL is correct, publicly reachable and points to the intended image rather than a local file or an obsolete asset.

og:url

The canonical page URL helps identify which page the metadata describes. Check the protocol, hostname, path and trailing slash against the URL you actually want people to share.

What about Twitter Card tags?

Twitter Card metadata uses fields such as twitter:card, twitter:title, twitter:description and twitter:image. Some sites use Twitter-specific values while others rely on their Open Graph metadata. Checking both groups can reveal a mismatch where one platform receives different text or an image than another.

How to inspect the HTML

1. Open the page you want to share.
2. View the page source or inspect the document head in your browser's developer tools.
3. Search for og: and twitter: meta tags.
4. Compare the detected title, description, image and URL with the page you intend to share.
5. Fix missing, duplicated or incorrect values in the page template, then check the generated HTML again.

Why a direct URL preview can fail in a browser

A browser page cannot freely read the HTML of every other website. Cross-origin rules can prevent JavaScript from accessing a response unless the target server explicitly permits it. This is a browser security feature, not an indication that the page has no Open Graph tags. If a direct URL request fails, inspect or paste the page source instead.

Common Open Graph problems

• Missing image: the og:image tag is absent or its URL is invalid.
• Wrong image: an old image remains in the template or a platform is displaying cached metadata.
• Wrong URL: og:url points to another path or an old hostname.
• Generic title: every page uses the same social title instead of a page-specific one.
• Duplicate tags: multiple values for the same property can make debugging harder and lead to inconsistent results.

Why preview testing is useful before publishing

Checking the rendered metadata before publishing catches errors while they are still easy to fix. It is especially useful after changing a site template, moving pages, replacing social images or changing canonical URLs. A small metadata check can prevent a page from being shared with the wrong identity.