mmintel/klz-cables.com
1
0
Fork 0
Code Issues Pull Requests 2 Actions Packages Projects Releases Wiki Activity

fix(routing): resolve 404 on German product pages via rewrites and localized links

Browse Source
This commit is contained in:
Marc Mintel
2026-02-23 12:36:37 +01:00
parent 97db28aad9
commit 738a6069e2
3 changed files with 25 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
app/[locale]/products/[...slug]/page.tsx
View File

@@ -53,17 +53,17 @@ export async function generateMetadata({ params }: ProductPageProps): Promise<Me
title: categoryTitle,
description: categoryDesc,
alternates: {
canonical: `${SITE_URL}/${locale}/products/${productSlug}`,
canonical: `${SITE_URL}/${locale}/${await mapFileSlugToTranslated('products', locale)}/${productSlug}`,
languages: {
de: `${SITE_URL}/de/products/${await mapFileSlugToTranslated(productSlug, 'de')}`,
en: `${SITE_URL}/en/products/${await mapFileSlugToTranslated(productSlug, 'en')}`,
'x-default': `${SITE_URL}/en/products/${await mapFileSlugToTranslated(productSlug, 'en')}`,
de: `${SITE_URL}/de/${await mapFileSlugToTranslated('products', 'de')}/${await mapFileSlugToTranslated(productSlug, 'de')}`,
en: `${SITE_URL}/en/${await mapFileSlugToTranslated('products', 'en')}/${await mapFileSlugToTranslated(productSlug, 'en')}`,
'x-default': `${SITE_URL}/en/${await mapFileSlugToTranslated('products', 'en')}/${await mapFileSlugToTranslated(productSlug, 'en')}`,
},
},
openGraph: {
title: `${categoryTitle} | KLZ Cables`,
description: categoryDesc,
url: `${SITE_URL}/${locale}/products/${productSlug}`,
url: `${SITE_URL}/${locale}/${await mapFileSlugToTranslated('products', locale)}/${productSlug}`,
images: getProductOGImageMetadata(fileSlug, categoryTitle, locale),
},
twitter: {
@@ -81,18 +81,18 @@ export async function generateMetadata({ params }: ProductPageProps): Promise<Me
title: product.frontmatter.title,
description: product.frontmatter.description,
alternates: {
canonical: `${SITE_URL}/${locale}/products/${slug.join('/')}`,
canonical: `${SITE_URL}/${locale}/${await mapFileSlugToTranslated('products', locale)}/${slug.join('/')}`,
languages: {
de: `${SITE_URL}/de/products/${await mapFileSlugToTranslated(slug[0], 'de')}/${await mapFileSlugToTranslated(productSlug, 'de')}`,
en: `${SITE_URL}/en/products/${await mapFileSlugToTranslated(slug[0], 'en')}/${await mapFileSlugToTranslated(productSlug, 'en')}`,
'x-default': `${SITE_URL}/en/products/${await mapFileSlugToTranslated(slug[0], 'en')}/${await mapFileSlugToTranslated(productSlug, 'en')}`,
de: `${SITE_URL}/de/${await mapFileSlugToTranslated('products', 'de')}/${await mapFileSlugToTranslated(slug[0], 'de')}/${await mapFileSlugToTranslated(productSlug, 'de')}`,
en: `${SITE_URL}/en/${await mapFileSlugToTranslated('products', 'en')}/${await mapFileSlugToTranslated(slug[0], 'en')}/${await mapFileSlugToTranslated(productSlug, 'en')}`,
'x-default': `${SITE_URL}/en/${await mapFileSlugToTranslated('products', 'en')}/${await mapFileSlugToTranslated(slug[0], 'en')}/${await mapFileSlugToTranslated(productSlug, 'en')}`,
},
},
openGraph: {
title: `${product.frontmatter.title} | KLZ Cables`,
description: product.frontmatter.description,
type: 'website',
url: `${SITE_URL}/${locale}/products/${slug.join('/')}`,
url: `${SITE_URL}/${locale}/${await mapFileSlugToTranslated('products', locale)}/${slug.join('/')}`,
images: getProductOGImageMetadata(productSlug, product.frontmatter.title, locale),
},
twitter: {
@@ -236,7 +236,7 @@ export default async function ProductPage({ params }: ProductPageProps) {
{productsWithTranslatedSlugs.map((product) => (
<Link
key={product.slug}
href={`/${locale}/products/${productSlug}/${product.translatedSlug}`}
href={`/${locale}/${productSlug}/${product.translatedSlug}`}
className="group block bg-white rounded-[32px] overflow-hidden shadow-sm hover:shadow-2xl transition-all duration-500 border border-neutral-dark/5"
>
<Card tag="article" className="premium-card-reset">
@@ -381,7 +381,7 @@ export default async function ProductPage({ params }: ProductPageProps) {
</Link>
<span className="mx-4 opacity-20">/</span>
<Link
href={`/${locale}/products/${categorySlug}`}
href={`/${locale}/${productSlug}`}
className="hover:text-accent transition-colors"
>
{categoryTitle}
@@ -504,7 +504,7 @@ export default async function ProductPage({ params }: ProductPageProps) {
'@type': 'Offer',
availability: 'https://schema.org/InStock',
priceCurrency: 'EUR',
url: `${SITE_URL}/${locale}/products/${slug.join('/')}`,
url: `${SITE_URL}/${locale}/${await mapFileSlugToTranslated('products', locale)}/${slug.join('/')}`,
itemCondition: 'https://schema.org/NewCondition',
},
additionalProperty: technicalItems.map((item: any) => ({
@@ -515,7 +515,7 @@ export default async function ProductPage({ params }: ProductPageProps) {
category: product.frontmatter.categories.join(', '),
mainEntityOfPage: {
'@type': 'WebPage',
'@id': `${SITE_URL}/${locale}/products/${slug.join('/')}`,
'@id': `${SITE_URL}/${locale}/${await mapFileSlugToTranslated('products', locale)}/${slug.join('/')}`,
},
} as any
}

4
components/RelatedProducts.tsx
View File

@@ -2,6 +2,7 @@ import { getAllProducts } from '@/lib/mdx';
import { getTranslations } from 'next-intl/server';
import Image from 'next/image';
import { RelatedProductLink } from './RelatedProductLink';
import { mapFileSlugToTranslated } from '@/lib/slugs';
interface RelatedProductsProps {
currentSlug: string;
@@ -16,6 +17,7 @@ export default async function RelatedProducts({
}: RelatedProductsProps) {
const products = await getAllProducts(locale);
const t = await getTranslations('Products');
const productsSlug = await mapFileSlugToTranslated('products', locale);
// Filter products: same category, not current product
const related = products
@@ -61,7 +63,7 @@ export default async function RelatedProducts({
return (
<RelatedProductLink
key={product.slug}
href={`/${locale}/products/${catSlug}/${product.slug}`}
href={`/${locale}/${productsSlug}/${catSlug}/${product.slug}`}
productSlug={product.slug}
productTitle={product.frontmatter.title}
className="group block bg-white rounded-[32px] overflow-hidden shadow-sm hover:shadow-2xl transition-all duration-500 border border-neutral-dark/5"

8
next.config.mjs
View File

@@ -344,6 +344,14 @@ const nextConfig = {
}
return [
{
source: '/de/produkte',
destination: '/de/products',
},
{
source: '/de/produkte/:path*',
destination: '/de/products/:path*',
},
{
source: '/cms/:path*',
destination: `${directusUrl}/:path*`,