title next/head not working for SEO
Unanswered
Tan posted this in #help-forum
TanOP
i've got a page title that i've placed inside a
is there something that i'm missing, or is this a potential bug with
Edit: i am not using the app directory
Head tag brought in from next/head, but when i curl my URL the page title isn't returned like the meta description tag is. the title does show if i import Head from next/document.is there something that i'm missing, or is this a potential bug with
Head from next/head?Edit: i am not using the app directory
16 Replies
@Tan i've got a page title that i've placed inside a `Head` tag brought in from `next/head`, but when i curl my URL the page title isn't returned like the meta description tag is. the title does show if i import `Head` from `next/document`.
is there something that i'm missing, or is this a potential bug with `Head` from `next/head`?
Edit: i am not using the app directory
Gończy Polski
If you use app directory use metadata api (export const metadata: Metadata)
TanOP
I’m not using app directory, updated op to include that info
TanOP
below is an example of one title that is working and that isn't in my usecase. let me know if there's any other info i can provide.
import { Html, Head } from 'next/document'
import NextHead from 'next/head'
export default class Document {
render() {
return (
<Html lang="en">
{/* this page title does return in curl */}
<Head>
<title>Page Title 1</title>
</Head>
{/* this page title does not return in curl */}
<NextHead>
<title>Page Title 2</title>
</NextHead>
</Html>
)
}
}@Tan below is an example of one title that is working and that isn't in my usecase. let me know if there's any other info i can provide.
import { Html, Head } from 'next/document'
import NextHead from 'next/head'
export default class Document {
render() {
return (
<Html lang="en">
{/* this page title does return in curl */}
<Head>
<title>Page Title 1</title>
</Head>
{/* this page title does not return in curl */}
<NextHead>
<title>Page Title 2</title>
</NextHead>
</Html>
)
}
}
The title in Head (next/document) overwrites the title in Head (next/head) it looks like
TanOP
what i've been noticing is that while the page loads,
Page Title 1 renders, but once the page has finished loading, it then shows Page Title 2In the first place you’re only supposed to use <Head /> in the document file, to customise the head you do it in pages and in _app and in other components
TanOP
that's what i thought, but when i do that i get a message pointing to the below doc: https://nextjs.org/docs/messages/no-title-in-document-head
technically, things are actually working as expected from a usecase scenario. it's really these docs that are throwing me off
@Tan that's what i thought, but when i do that i get a message pointing to the below doc: https://nextjs.org/docs/messages/no-title-in-document-head
Well yes of course. What I said is the Head from next/document is only supposed to be used like <Head /> without content
Actual head data should go with next/head in other components
Actual head data should go with next/head in other components
_document.js is a sacred place, put your logic inside other components
TanOP
understood-- then is there something i'm missing with
next/head that i'd need to do to get <title> tags to return in curl commands?@Tan understood-- then is there something i'm missing with `next/head` that i'd need to do to get `<title>` tags to return in curl commands?
Nothing. Just render <title> in next/head as normal
Ensure it is rendered in all branches of your code (so not something like if (loading) return null)
TanOP
i can't believe i didn't think of this... thank you so much!
will follow up if this doesn't do the trick for whatever reason