Missing Open Graph Tags: Fixing the Core og Block
A page with no Open Graph tags still gets shared, but every platform that builds a link card has to guess what to show. The guess is usually the title element, a scrap of body text and whichever image happens to be first, which is often a logo, an icon or nothing at all.
This guide is about the tags themselves: which properties make up the core block, how to generate a correct value for each one from the page you already have, where the block has to sit so readers actually find it, and how to prove every page type now carries it.
What counts as the core block
The Open Graph protocol, published at ogp.me, names four properties as required on every page: og:title,
og:type, og:image and og:url. A fifth, og:description,
is optional in the specification but shown by nearly every platform that draws a card, so a generator
treats a page without it as incomplete. og:site_name is optional as well; without it, most
cards fall back to the bare domain.
| Property | Status in the protocol | What happens when it is missing |
|---|---|---|
og:title | Required | The reader falls back to the title element, brand suffix and all. |
og:type | Required | Most readers assume website, so the
loss is small, but a validator will still flag it. |
og:image | Required | The reader hunts through the page for an image, or shows a text-only card. |
og:url | Required | The address that was shared is used as-is, tracking parameters included. |
og:description | Optional | The meta description is used if present; otherwise a slice of body text, often navigation or a cookie notice. |
og:site_name | Optional | The domain name is shown instead of the business name. |
The finding "missing OG tags" covers two quite different situations. In the first, the page has no Open Graph markup at all, usually because nothing in the stack was ever set up to print it. In the second, some tags are present and others are not: a theme prints a title and description but no image, or a plugin prints everything except on one type of page. The fixes overlap, but the second case needs you to find the gap rather than start from scratch.
Why pages end up without tags
Tags rarely go missing because someone deleted them. They go missing because the part of the site that should print them never runs for that page, or runs too late. These are the causes that come up most often.
- A hand-built site that never had them. Static sites and older bespoke templates often have a title and meta description and nothing else, because Open Graph was not on anyone's list when the template was written.
- Tags added in the browser. A single-page app that writes tags with JavaScript after the page loads gives crawlers a head with no Open Graph tags in it. Link preview bots generally read the HTML the server sends and do not run scripts.
- One template out of many. The blog template prints tags; the product, category, search or landing page templates do not. Audits that only test the home page miss this completely.
- An SEO plugin switched off or replaced. In WordPress the social tags usually come from Yoast, Rank Math or a similar plugin, and a setting such as the Facebook or social toggle can turn them off site-wide. Swapping plugins can leave a gap between the old one being removed and the new one being configured.
- Tags pushed out of the head. HTML parsers close the head as soon as they meet something
that does not belong there, such as a stray
div, animgtracking pixel or visible text. Every meta tag after that point ends up in the body, where some readers ignore it. - Empty values. The tag is printed but the variable feeding it was empty, giving
content="". To a validator that is as good as missing.
Finding exactly what is missing
Start with the OG / Twitter Tag Generator, which flags the tags that are missing or invalid for the page you enter. Then look at the raw HTML yourself, because the answer to "why" is usually in the source.
Look at what the server sends
Use view-source in the browser (view-source: before the address in Chrome, Edge or Firefox),
not the element inspector. The inspector shows the page after scripts have run, which can include tags
that no crawler will ever see.
curl -sL -A "facebookexternalhit/1.1" https://www.example.co.uk/services/boiler-repair \
| grep -io '<meta[^>]*property="og:[^"]*"[^>]*>'That command fetches the page with a user agent similar to Facebook's and prints every og:
tag it finds. An empty result means no tags at all in the served HTML. A partial result tells you which
properties are absent. Try the same command with an ordinary browser user agent: if the two differ, something
on the server, such as a cache or a bot rule, is serving crawlers a different page.
Check the head has not closed early
If the tags are in the source but a validator still says they are missing, check what comes before
them. Anything that is not allowed in the head, including a noscript block containing an image, a tag
manager snippet placed in the wrong spot or an HTML comment wrapped around broken markup, can end the
head. In the browser's element inspector, expand <head>: if the Open Graph tags appear
under <body> instead, the head closed early.
Test one page of each type
Make a short list: home page, a standard content page, a blog post, a product, a category, a contact page and any landing pages built with a page builder. Run each through the generator. Missing tags almost always follow a pattern by template, and the pattern tells you which file to change.
Generating a value for each tag
The job is not to write tags by hand for hundreds of pages but to decide, once, where each value comes from. Every site already holds the information; the template just needs to be told where to find it.
| Tag | Best source | Fallback when that is empty |
|---|---|---|
og:title | A dedicated social title field, if your CMS has one | The page heading or the title element without the brand suffix |
og:description | A dedicated social description field | The meta description, then the page excerpt or summary |
og:type | The template: article for dated posts | website
for everything else |
og:url | The same variable that prints the canonical tag | The page's clean permanent address, never the request address |
og:image | A chosen share image or the featured image | A site-wide default share image |
og:site_name | A single site setting | None needed; it rarely changes |
Clean the text before printing it
Values that come from content fields often carry HTML, line breaks or quotation marks. Strip tags,
collapse whitespace and escape quotes, so a product called The "Classic" Kettle does not
end the attribute early. Most template languages have an attribute-escaping filter: esc_attr()
in WordPress, | escape in Liquid, and automatic escaping in React and most modern frameworks.
Make every URL absolute
og:image and og:url must be full addresses starting with https://.
Upload fields and asset helpers often return /uploads/photo.jpg; prefix the site's base
address in the template rather than trusting every editor to paste a full link.
A complete block
<meta property="og:type" content="website">
<meta property="og:site_name" content="Brindle & Oak Heating">
<meta property="og:title" content="Boiler repair in Sheffield, usually within 48 hours">
<meta property="og:description" content="Gas Safe engineers for combi and system boilers. Fixed call-out price, parts carried on the van.">
<meta property="og:url" content="https://www.example.co.uk/services/boiler-repair">
<meta property="og:image" content="https://www.example.co.uk/media/share/boiler-repair-1200x630.jpg">
<meta property="og:image:width" content="1200">
<meta property="og:image:height" content="630">
<meta property="og:image:alt" content="An engineer checking the pressure gauge on a wall-mounted combi boiler">
<meta property="og:locale" content="en_GB">Note the ampersand in the site name is written as & inside the attribute, which
is what escaping produces. Platforms decode it and show a normal ampersand.
The fix, step by step
Step 1
List which pages have no tags
Pick
one example of every template your site uses, including the home page, ordinary pages, posts, products,
categories and any page-builder landing pages. Run each through the OG / Twitter Tag Generator and write
down which of og:title, og:type, og:image, og:url
and og:description it reports as missing or empty. A pattern will appear, and it tells you
which template or plugin setting needs attention first.
Step 2
Decide where the values come from
For
each tag, choose one source field and one fallback, and write the choice down so everyone editing templates
follows it. A sensible default is a social title field falling back to the page heading, a social description
falling back to the meta description, the canonical variable for og:url, and the featured
image falling back to a site-wide share image. Using the same sources everywhere stops templates drifting
apart over time.
Step 3
Write the core block into the template
Put
the Open Graph tags in the shared head partial or layout that every page uses, not in individual page
templates, so a new page type inherits them automatically. Use property= as the attribute,
escape every value for use inside an attribute, and print absolute https:// addresses. If
an SEO plugin or app already prints some tags, configure it to print all of them rather than adding a
second set by hand.
Step 4
Give every page a working og:image
Create
one default share image in JPG or PNG, around 1200 by 630 pixels, showing your name or logo on a plain
background, and upload it to a public address that loads without cookies. Set it as the fallback for
any page without its own image. Then declare og:image:width, og:image:height
and og:image:alt alongside it so readers can lay out the card before downloading the file.
Step 5
Keep the block inside the real head
Place the Open Graph tags near the top of the head, directly after the charset, viewport,
title and canonical tags, and before large inline scripts, styles or tag manager snippets. Move any tracking
pixel, noscript image or stray markup out of the head and into the body. Then open the element inspector
and confirm every og: tag sits under <head>, not under <body>,
on each template.
Step 6
Check the served HTML for each page type
Purge any page cache, then fetch one page of each type with curl or view-source and confirm the full block is there with real values, not empty strings or placeholder text. Run the same pages through the generator again until nothing is reported missing. Finally, test a page that has no featured image and a page with quotation marks in its title, because those are where fallbacks and escaping usually fail.
Where the tags come from on common platforms
The fix is always the same in principle: one place prints the block, fed by page data. What differs is where that place is.
WordPress
WordPress core does not print Open Graph tags. Themes sometimes do, and SEO plugins almost always do. If tags are missing across the whole site, check that the plugin's social or Open Graph output is switched on. If they are missing on one post type only, check that the post type is not excluded in the plugin's content-type settings. Plugin-by-plugin settings are covered in Open Graph in WordPress.
Shopify
Most themes include a snippet, often named something like meta-tags.liquid, rendered
from theme.liquid. If tags vanished after a theme change, the new theme may not render it,
or a customised copy may have lost the include. Check the layout file for the render call before adding
tags anywhere else.
Static sites and hand-written HTML
Move the head into a shared include if your generator supports one (Eleventy, Hugo and Jekyll all
do), and feed the values from each page's front matter. If the site is truly hand-written, add the block
to every file and keep a checklist; a site-wide search for og:title will show which files
still lack it.
JavaScript frameworks
Next.js, Nuxt, SvelteKit, Astro and Remix can all render Open Graph tags on the server, but only if
you use their server-side metadata features rather than setting tags in a browser effect. A React app
built with Create React App or plain Vite has a single index.html, so without pre-rendering
every page shows the same tags or none. The framework route is covered in Open
Graph in Next.js.
Edge cases worth checking
- Pages behind a login. Crawlers see whatever a visitor without a session sees. If that is a login page, the login page's tags are what gets shared. Either give the public version its own tags or accept that private pages will not preview.
- Search and filter pages. Internal search results and filtered category views often use a stripped-down template. They are shared less often, but when they are, they should still carry a title and the default image.
- Error pages. A 404 page that returns a 200 status with Open Graph tags copied from the home page will make broken links look like working ones. Let error pages return the correct status code.
- Duplicate blocks. Fixing missing tags by pasting a new block while a plugin prints
a partial one leaves two
og:titletags. Readers usually take the first, which may be the wrong one. Remove one source entirely. - Consent tools. Some cookie banners rewrite the head or hold back scripts. They should never remove meta tags, but check the served HTML with the banner enabled.
- Very large heads. A head stuffed with inline CSS or JSON can push the Open Graph tags past the point some readers stop parsing. Keep the tags early.
Keeping every new page covered
The durable fix is structural: one head partial, one set of rules for values, one default image. After that, keep it from regressing.
- Add a check to your release process. A short script that fetches a handful of representative
addresses and fails if any lacks
og:title,og:imageorog:urlwill catch a broken template before visitors do. - Test new templates on day one. Every time a developer or page builder adds a new layout, run one page through the generator before it goes live.
- Protect the default image. Keep the fallback share image somewhere it will not be tidied away in a media library clean-up, and never delete or rename it without updating the template.
- Document the plugin choice. Write down which plugin or snippet owns the social tags. Most duplicate or missing tag problems start when a second person adds a second tool.
For the rest of the head, such as title and description length or robots directives, see the Meta Analyzer Guide. For choosing and sizing the share image properly, see fixing wrong OG image dimensions.
1. What are the minimum Open Graph tags every page needs?
The Open Graph protocol lists four required properties: og:title, og:type, og:image and og:url. In practice you should add og:description as well, because nearly every platform shows it, and og:site_name so cards display your business name instead of the domain. Adding og:image:width, og:image:height and og:image:alt costs nothing and helps the first share render properly. Each tag should appear exactly once, inside the head, in the HTML your server sends, with a real value rather than an empty string.
2. What happens if a page has no Open Graph tags at all?
The link can still be shared, but each platform improvises. Most take the title element as the headline, look for a meta description or the first readable paragraph for the text, and search the page for an image. The result is often a card with a logo, an icon, a cookie banner sentence or no picture. Different platforms guess differently, so the same link can look quite different on each one, which is hard to control.
3. Can I add Open Graph tags with Google Tag Manager or JavaScript?
You can insert them, but it will not help link previews. The bots that build cards for Facebook, LinkedIn, X, WhatsApp, Slack and similar services read the HTML the server returns and generally do not run JavaScript. Tags added by a tag manager or a browser script only exist after scripts run, so the bots never see them. Open Graph tags need to be printed by the server, a static build or server-side rendering.
4. Is og:type really required if most sites ignore it?
The protocol lists it as required, and validators including our generator will report it as missing. Many readers assume website when it is absent, so leaving it out rarely breaks a card on its own. It does matter for editorial pages, because setting og:type to article is what makes the article properties such as publication time meaningful. It takes one line in a template, so include it and set it correctly for each page type.
5. Should og:description be the same as my meta description?
Using the meta description as a fallback is fine and is what most plugins do. The two serve different audiences, though. The meta description is written to earn a click from a search results page, while og:description sits under a picture in a social feed or chat, where a slightly more conversational line often works better. If your CMS offers a separate social description field, use it for important pages and let the fallback cover the rest.
6. Why does the generator say tags are missing when I can see them in the source?
The most common reason is that the head closed early. HTML parsers end the head when they meet an element that is not allowed there, such as an image, a div or visible text, and every tag after that point is moved into the body. Other causes are empty content attributes, tags written with name instead of property by a hand-made template, or a cache serving crawlers an older copy of the page than the one you are viewing.
7. Do I need Open Graph tags on every single page?
Every page that anyone might share should have them, which in practice means every public, indexable page. Pages such as baskets, account areas and checkout steps are rarely shared and can use the site-wide defaults. The simplest approach is to print the block from the shared layout so every page gets at least a title, the default image and the correct url automatically, then give important pages their own image and description.
The OG / Twitter Tag Generator builds the Open Graph and X card block for your page, validates it against the requirements of Facebook, LinkedIn and X, predicts how the preview will render and flags every tag that is missing or invalid.
Open Open Graph Fixes →