Opengraph metadata custom property fields #55043
-
|
I'm using the Next.js 13 with app directory and I want to add opengraph metadata. Adding title, description and url is straight forward using the following code: export async function generateMetadata(props: Props): Promise<Metadata> {
return {
openGraph: {
title: "foo",
description: "bar",
url: "buzz",
},
}
}which creates the following output: <meta property="og:title" content="foo">
<meta property="og:description" content="bar">
<meta property="og:url" content="buzz">But is there any way to create metatags with the property of The expected output is on the attached image below.
Things I have tried so farUsing the export const metadata = {
other: {
custom: 'meta',
},
}It generates the following output: <meta name="custom" content="meta" />But I want the output as <meta property="custom" content="meta" /> |
Beta Was this translation helpful? Give feedback.
Replies: 1 comment 2 replies
-
|
The solution was to simple add the Example: export default function Page() {
return (
<>
<meta property="foo" content="bar" />
{/* actual page contents */}
</>
);
}Thanks to Note that |
Beta Was this translation helpful? Give feedback.
-
|
Thanks so much for this! I just wasted a lot of time trying all of the same things (also the old It'd be great for this to be documented or, even better, officially supported via the |
Beta Was this translation helpful? Give feedback.
-
|
For posterity, I've created a follow-up Discussion thread! |
Beta Was this translation helpful? Give feedback.
The solution was to simple add the
<meta property="foo" content="bar" />in the page itself.Example:
Thanks to
joulevin discord who found the fix at this help-forum.Note that
joulevquoted: