generateStaticParams with localized slugs
Unanswered
California Condor posted this in #help-forum
California CondorOP
Hi,
How can I do that the slug changes when I change the language... I'm using server component and generateStaticParams but impossible to change the slug..
How can I do that the slug changes when I change the language... I'm using server component and generateStaticParams but impossible to change the slug..
30 Replies
California CondorOP
In the build log I see that all pages are generated succesfully but impossible to switch to the right slug
@California Condor Hi,
How can I do that the slug changes when I change the language... I'm using server component and generateStaticParams but impossible to change the slug..
you can do that by entering a list of available language codes. Something like this:
The output then looks like this: (see attached). As you can see, all routes are built with all configured languages (in my case "en" and "de")
export async function generateStaticParams() {
return i18n.locales.map((locale) => ({lang: locale}))
}The output then looks like this: (see attached). As you can see, all routes are built with all configured languages (in my case "en" and "de")
California CondorOP
@B33fb0n3 it looks like this on my side:
it's just the problem that on my blog articles it won't change the slug when switching the language
@California Condor it's just the problem that on my blog articles it won't change the slug when switching the language
don't you redirect the client to the chosen language code?
Is each blog post route his own database entry or how do you handle it?
Is each blog post route his own database entry or how do you handle it?
California CondorOP
@B33fb0n3 I change the language like that:
<Link href={/${currentLocale}/about} className="text-gray-700 hover:text-gray-900">
{t('navbar.about')} </Link>@California Condor <@301376057326567425> I change the language like that: `<Link href={`/${currentLocale}/about`} className="text-gray-700 hover:text-gray-900">
{t('navbar.about')} </Link>`
but you (hopefully) also using a middleware, right?
California CondorOP
@B33fb0n3 yes, but not sure if that's good like that
And I'm calling an api from strapi for the blog articles
@California Condor <@301376057326567425> yes, but not sure if that's good like that
that looks right. You can remove the
currentLocale from your routes, because whenever the route changes, the language code will be added though your middlewareSo, back to the blog pages:
Is each blog post route his own database entry or how do you handle it?
California CondorOP
Maybe my config.ts is wrong?
When I remove the currentLocale and click on "Über uns" for example, it switches directly back to the english locale
Can you try to switch this: (see attached). And also: what kind of options are in
localePrefix?@B33fb0n3 Can you try to switch this: (see attached). And also: what kind of options are in localePrefix?
California CondorOP
Hm when I switch it to true it's messing up all the /de /fr depending on what link I click
I set localePrefix to "as needed" so when the website opens in the defaultLocale (en) there is no locale in the url
@California Condor Hm when I switch it to true it's messing up all the /de /fr depending on what link I click
What does messing up mean? Can you give me an example?
California CondorOP
I'm for example on http://localhost:3000/fr/a-propos then click on the Home button and it goes to http://localhost:3000/de
click on the Home buttonand how does the href of this looks like?
@B33fb0n3 > click on the Home button
and how does the href of this looks like?
California CondorOP
<Link href={
/}@California Condor <Link href={`/`}
then that's the correct behaviour 🤔
California CondorOP
Ahh, but it should go then to http://localhost:3000/fr/ not http://localhost:3000/
Can I not keep the href={
/${currentLocale}/} ?@California Condor Can I not keep the href={`/${currentLocale}/`} ?
Uhm ok… how is the current behavior from your blogs and how should it be?
California CondorOP
for example the english slug: http://localhost:3000/blog/post/the-evolution-of-modern-websites
then the when I switch do german it doesn't change the slug: http://localhost:3000/de/blog/post/the-evolution-of-modern-websites
California CondorOP
I guess I can't help with next-intl. I haven't used it enought to be able to resolve your issue