Next.js Discord

Discord Forum

Title Not Working in Head

Answered
Caribbean Elaenia posted this in #help-forum
Open in Discord
Caribbean ElaeniaOP
As the title says, I can't set the title of my pages using <Head>. I wanted each page to have a different title, of course, but unfortunately didn't work in this case. I really need help, thanks.

import Head from 'next/head';

export default function Home() {
  return (
    <>
      <Head>
        <title>NetVerse</title>
      </Head>
      <h1>Hello World!</h1>
    </>
  );
}
Answered by B33fb0n3
you are using the app router. The <Head>-Tag is part of the pages router. I recommend you still using the app router, like you are doing now.

To apply the header, remove your <Head>-Tag.
Add a metadata to your page like this:
import type { Metadata } from 'next'
 
export const metadata: Metadata = {
  title: '...',
  description: '...',
}
 
export default function Page() {}
View full answer

11 Replies

Caribbean ElaeniaOP
Yes, sure.
@Caribbean Elaenia Click to see attachment
B33fb0n3
you are using the app router. The <Head>-Tag is part of the pages router. I recommend you still using the app router, like you are doing now.

To apply the header, remove your <Head>-Tag.
Add a metadata to your page like this:
import type { Metadata } from 'next'
 
export const metadata: Metadata = {
  title: '...',
  description: '...',
}
 
export default function Page() {}
Answer
Caribbean ElaeniaOP
Alr.
@Caribbean Elaenia Alr.
B33fb0n3
will u try it now directly?
Caribbean ElaeniaOP
1 min.
It worked.
Thank you so much!
B33fb0n3