I have a Next.js website with multiple pages.
All pages are in English except one which is in French which doesn't have an English version of it.
How can I set the HTML tag lang attribute on that specific page?
This is not something I could achieve using next/head or with a custom document.
My _document.js class currently looks like this, so that English is the default for all pages:
import { Html, Head, Main, NextScript } from 'next/document'
export default function Document() {
return (
<Html lang="en">
<Head />
<body>
<Main />
<NextScript />
</body>
</Html>
)
}
What I would need is to dynamically set the lang attribute value to fr for one specific page.
I think for this, one the easiest solution could be layouts.
You can read more about here
https://nextjs.org/docs/basic-features/layouts
And add Next custom Tags