next.js

NextJS dynamic title


Have been googling forever and found a way to change the <title>. That way is this: https://github.com/zeit/next.js/tree/master/examples/layout-component

The main problem with this is that everytime someone refresh the site/change page the title goes from http://localhost:3000 to the actual Title (eg. About us) and I'm a bit afraid of how this is affecting the SEO.

What is the correct way of chaning the page title dynamically?

My layout file:

import Link from 'next/link'
import Head from './../node_modules/next/head'

export default function Layout({ children, title = 'Welcome to my website' }) {
  return (
    <div>
        <Head>
          <title>{title}</title>
        </Head>

        {children}
    </div>
  )
}

Solution

  • I reninstalled "next" and "next-routes" in my dependencies and now this works.