OG Meta Tags: The Four Required Ones, and Why Your Preview Is Wrong

OG meta tags are Open Graph tags: snippets of HTML that tell social platforms and messaging apps what title, description and image to show when someone shares your page.

Without them, the platform guesses. It usually grabs your page title, the first text it finds, and whichever image happens to be largest, which is how a professional post ends up previewing with a sidebar advert.

The four required tags

The Open Graph protocol defines exactly four properties as required on every page. These are the spec’s own descriptions.

• og:title. “The title of your object as it should appear within the graph.”
• og:type. “The type of your object.” For most pages this is website or article.
• og:image. “An image URL which should represent your object within the graph.”
• og:url. “The canonical URL of your object that will be used as its permanent ID in the graph.”

Source for all four: the Open Graph protocol.

They go in the <head> of the page, as meta tags using property rather than name. That distinction trips people up, because most other meta tags use name.

One detail worth noting on og:url: the spec calls it the permanent ID for the object. If the same content is reachable at several addresses, they should all declare the same og:url, or each variant becomes a separate object with its own share counts.

The optional tags worth adding

• og:description. The spec asks for “a one to two sentence description of your object”. This is separate from your meta description, and the two have different jobs: one is written to earn a click from a results page, the other to earn a click from a feed.
• og:site_name. The name shown for the overall site the page belongs to.
• og:locale. The locale the tags are written in, in language_TERRITORY form. The default is en_US, so set it if that is not you.
• og:locale:alternate. Other locales the page exists in.
• og:audio and og:video. URLs to media that accompanies the object.
• og:determiner. The word before the title in a sentence, accepting a, an, the, blank or auto. Rarely needed, and the default is blank.

Most pages need the four required tags plus og:description and og:site_name. Everything else is situational.

og:image, where most of the trouble is

The image is the part people actually notice, and it has structured properties of its own that almost nobody sets.

• og:image:width and og:image:height, in pixels. Declaring these lets a platform reserve the right space before it has downloaded the file, which is why some previews render instantly and others pop in late or crop oddly.
• og:image:type, the MIME type of the file.
• og:image:secure_url, an alternate URL for pages served over HTTPS.
• og:image:alt, which the spec describes as a description of the image’s contents rather than a caption. The spec is direct about this: if a page specifies og:image, “it should specify og:image:alt”.

Two practical rules beyond the spec. Use an absolute URL, because a relative path will not resolve for a platform fetching your page from outside. And remember that the preview image is usually cropped to the platform’s own ratio, so text near the edges of your image will be cut off.

The same thinking about descriptive alt text applies to images on the page itself, which our guide to image SEO covers.

What happens when tags conflict

This is the part that explains most of the confusing debugging sessions, and it comes straight from the spec.

A property that can hold several values is written as repeated meta tags rather than a list. When two tags conflict, the first one from top to bottom wins.

Structured properties attach to the most recent root tag, and a new root tag closes the previous group. So if you declare two images and then a width, that width belongs to the second image, not the first.

Order matters, in other words, and it matters in a way nothing warns you about. If a plugin outputs its og:image and your theme outputs another one further down, the plugin wins and editing the theme changes nothing.

What WordPress does for you

On WordPress you rarely write these by hand. Yoast and All in One SEO both output Open Graph tags automatically, pulling the title, description and featured image from the post.

That is usually correct, and it is also the source of the duplicate-tag problem above. If your theme or another plugin also outputs Open Graph tags, you end up with two sets and the first in the source wins.

So before debugging anything, view the page source and search for og:. If you see each property twice, the fix is to stop one of the two from outputting them rather than to keep editing the one that is being ignored. Our comparison of All in One SEO and Yoast covers how each handles this.

Do OG tags affect SEO?

Not directly. Open Graph is a sharing protocol, not a ranking input, and adding the tags will not move you up the results page.

The indirect case is real but modest. A share that previews properly gets more clicks than one that previews as a grey box with a stray image, and more sharing means more chance of the mentions and links that do affect rankings.

Treat them as part of your technical hygiene rather than a ranking tactic, alongside everything else in our technical SEO checklist. They are cheap to get right and visibly embarrassing to get wrong.

Testing, and the mistakes that cause most problems

Every major platform runs a debugger that fetches your page and shows what it sees. Use one after any change, because platforms cache aggressively and a correct tag can still show an old preview for days.

• Relative image URLs. The single most common failure. The URL must be absolute.
• Duplicate tags from plugin and theme. First one in the source wins, which is rarely the one you edited.
• Missing og:image:alt. The spec asks for it whenever og:image is set, and it is almost always left out.
• Using name instead of property. Open Graph tags use property, and a tag with name will simply be ignored.
• Assuming a change is live. Platforms cache previews, so re-scrape through the debugger rather than trusting a fresh share.
• Reusing the meta description verbatim. It works, and it is a missed opportunity, because the two are read in very different contexts. Our guide to writing meta descriptions that get clicks explains the difference.

Frequently asked questions

What are OG meta tags?

OG meta tags are Open Graph tags, placed in the head of a page to tell social platforms and messaging apps which title, description and image to display when the page is shared. Without them the platform guesses, which often produces a broken looking preview. They use the property attribute rather than the name attribute used by most other meta tags.

Which Open Graph tags are required?

The protocol defines four as required: og:title, og:type, og:image and og:url. In practice og:description and og:site_name are worth adding to almost every page as well. Everything else in the specification, including the audio, video, locale and determiner properties, is situational.

Do Open Graph tags help SEO?

Not directly, because Open Graph is a sharing protocol rather than a ranking signal. The indirect benefit is that a page which previews properly tends to earn more clicks and more sharing, and sharing can lead to the mentions and links that do affect rankings. Treat them as technical hygiene rather than as a ranking tactic.

Why is the wrong image showing when I share my page?

The three usual causes are a relative image URL where an absolute one is needed, duplicate Open Graph tags from both a plugin and a theme, and platform caching holding an old preview. View the page source and search for og: to check for duplicates, remembering that when tags conflict the first one from the top wins. Then re-scrape the page in the platform’s own debugger.

Should og:description be the same as the meta description?

It can be, and it is better if it is not. The meta description is written to earn a click from a search results page, while og:description is read inside a social feed where the context and the mindset are different. The specification asks for one to two sentences describing the object.

Do I need to add OG tags manually in WordPress?

Usually not, because Yoast and All in One SEO both output them automatically from the post title, description and featured image. The thing to watch for is a theme or second plugin also outputting them, which gives you two sets of tags. Since the first set in the source wins, editing the wrong one appears to do nothing at all.