[App Router] Internalization on Metatags
Unanswered
Alligator mississippiensis posted this in #help-forum
Alligator mississippiensisOP
Hello guys,
im working on a small project and trying to achive Metatags based on generateMetadata()
Looks like that:
This will generate the metatags based on the visistor accepted-language
Page supports EN & DE
But what about the indexing? I think it will always take the en meta data, after some research you can provide the page <meta> tags with lang attribute, for instance:
<meta name="description" lang="de" content="…" />
Is there a way to achieve this with generateMetadata() or do I have to apply these hardcoded in the head tag?
im working on a small project and trying to achive Metatags based on generateMetadata()
Looks like that:
export async function generateMetadata({ params: {lng} }) {
return {
title: lng == "en" ? 'Mount Ink | Tattostudio based in Rosenheim / Bavaria' : 'Mount Ink | Tattostudio in Rosenheim / Bayern',
description: lng == "en" ? 'Welcome to MountInk, the best tattoo studio in Rosenheim. Experience the artistry of our global team of talented artists, who create transformative works of art on your skin.' : 'Herzlich willkommen bei MountInk, dem besten Tattoo-Studio in Rosenheim. Erleben Sie die Kunstfertigkeit unserer talentierten Künstler aus aller Welt, die transformative Kunstwerke auf Ihrer Haut zaubern.',
openGraph: {
...openGraphImage,
title: lng == "en" ? 'Mount Ink | Tattostudio based in Rosenheim / Bavaria' : 'Mount Ink | Tattostudio based in Rosenheim / Bavaria',
url: 'https://www.mountink.com',
description: lng == "en" ? 'Welcome to MountInk, the best tattoo studio in Rosenheim. Experience the artistry of our global team of talented artists, who create transformative works of art on your skin.' : 'Herzlich willkommen bei MountInk, dem besten Tattoo-Studio in Rosenheim. Erleben Sie die Kunstfertigkeit unserer talentierten Künstler aus aller Welt, die transformative Kunstwerke auf Ihrer Haut zaubern.'
}
}
}This will generate the metatags based on the visistor accepted-language
Page supports EN & DE
But what about the indexing? I think it will always take the en meta data, after some research you can provide the page <meta> tags with lang attribute, for instance:
<meta name="description" lang="de" content="…" />
Is there a way to achieve this with generateMetadata() or do I have to apply these hardcoded in the head tag?
4 Replies
What is the problem of indexing?
In this case, /en/page will be English metadata.
You can use
In this case, /en/page will be English metadata.
You can use
og:locale, or other tags such as alternates instead of adding lang attribute.Alligator mississippiensisOP
I just want the german text indexed for german driven devices and the english description for english users
Google identifies the language of a website with its domain/subdomain/subdirectory, which means you don't need to add any extra meta tags.
In additional, You can use the
See their blog: https://developers.google.com/search/blog/2010/03/working-with-multi-regional-websites#geotargeting-factors
In additional, You can use the
alternates or canonical meta tag which can help for indexing multilingual website.See their blog: https://developers.google.com/search/blog/2010/03/working-with-multi-regional-websites#geotargeting-factors
Note:
- Next.js supports
- Next.js supports
alternates.canonical and alternates.languages, you don't have to "hardcode" those tags (https://nextjs.org/docs/app/api-reference/functions/generate-metadata#alternates)