Next.js Discord

Discord Forum

PAGES - Should I keep reusing <Head>

Unanswered
Tibetan Mastiff posted this in #help-forum
Open in Discord
Tibetan MastiffOP
So, im trying to use pages routing. But not sure how i should structure my app here. In my Nextjs web app, i want to basically share same parent elements over and over again.. for example, a background, a nav bar, whenever i go to /home /about /contact etc. The navbar, background and other elements follow.

so
/home
<Head>
...
<title>Home</title>
</Head>
<MainLayout><Home/></MainLayout>

/about
<Head>
...
<title>About</title>
</Head>
<MainLayout><About/></MainLayhout>

..etc

Is this the proper flow I should follow? <MainLayout> has my <NavBar> etc.

2 Replies

No, currently in Pages Router, there’s no a “layout” feature similar to App Router. Generally, we will use NextSEO for titles, and just wrap the whole page in your <MainLayout>.
A suggestion from Next.js docs is to set a getLayout function in the page: https://nextjs.org/docs/pages/building-your-application/routing/pages-and-layouts#per-page-layouts
Moreover, if the layout is the same across all the pages, putting it in your _app is also recommended