og:url is the canonical URL of your page for social platforms. It tells them: "No matter which link someone shared, this is the address of this page."
<meta property="og:url" content="https://example.com/blog/launch-week" />Why og:url exists
People share one page under many addresses: with ?utm_source=newsletter, with ?ref=x, with and without www, with a trailing slash. Without og:url, a platform treats each of these as a different page. Likes, shares, and comments are then split across the variants.
With og:url, the platform groups them under one address.
Rules
- Use an absolute URL with
https://and the domain. - Use the same value as
rel="canonical". Search engines read the canonical link. Social platforms readog:url. They must agree. - No tracking parameters. No
utm_, no session IDs. - Each page points to itself. See the mistake below.
The mistake that breaks every preview
Facebook does not only store og:url. It goes to that URL and reads the Open Graph tags there. If a template puts the home page URL in og:url on all pages, every share of every page shows the title and the image of the home page.
If your blog posts all show the same preview, check og:url first.
og:url in Next.js
Set metadataBase once. Then give each page its path for the canonical link and for Open Graph.
// app/layout.tsx
export const metadata = {
metadataBase: new URL('https://example.com'),
}
// app/blog/[slug]/page.tsx
export async function generateMetadata({ params }) {
const { slug } = await params
return {
alternates: { canonical: `/blog/${slug}` },
openGraph: { url: `/blog/${slug}` },
}
}What happens when og:url is missing
The platform uses the address that was shared. The preview still shows. You lose the grouping of URL variants. The protocol lists og:url as required, so add it.
Check your og:url
The Open Graph checker lists the og:url of a page and warns you when it is missing. Related tags: og:title, og:type, og:image, and the full list of Open Graph tags.