Menu
I created this component for meta tags, here is a sample:
import React from "react";
const Meta = ({ pageTitle, desc }) => {
return (
<>
<meta charSet="utf-8" />
<meta httpEquiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width,initial-scale=1.0" />
<meta name="Author" content="Luteya Coulston Namasa" />
<meta name="description" content={desc}/>
<title>{`Luteya Coulston | ${pageTitle}`}</title>
</>
);
};
export default Meta;
The problem I'm facing is that it shows all the tags while still loading but after completely loading tags like title rewrites to <title></title> and Open Graph protocol gets removed completely. What could I be doing wrong?
653
asked Nov 29 '25 18:11
Wrap them in next/head
<Head>
<meta charSet="utf-8" />
<meta httpEquiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width,initial-scale=1.0" />
<meta name="Author" content="Luteya Coulston Namasa" key="author"/>
<meta name="description" content={desc}/>
<title>{`Luteya Coulston | ${pageTitle}`}</title>
</Head>
if you are using the same meta tag, add a key so it's not repeated.
Default tags should be used in in _app.js. og:tags, title and description etc should be used in your pages
188
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
