Next.js Discord

Discord Forum

sitemap question (languages)

Answered
Ruwbix posted this in #help-forum
Open in Discord
Avatar
RuwbixOP
This is my current sitemap. I have my default route which basically auto redirects to the language. Is this the correct way of doing things (never set up a sitemap before)? or am i supposed to define the languages as well? Also, the content is static, that means i shouldn't define a lastModified, should I?
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
<url>
<loc>https://immotogo.be/nl</loc>
</url>
<url>
<loc>https://immotogo.be/fr</loc>
</url>
<url>
<loc>https://immotogo.be/en</loc>
</url>
<url>
<loc>https://immotogo.be/nl/destination/gern</loc>
</url>
<url>
<loc>https://immotogo.be/fr/destination/gern</loc>
</url>
<url>
<loc>https://immotogo.be/en/destination/gern</loc>
</url>
<url>
<loc>https://immotogo.be/nl/destination/la-douane</loc>
</url>
<url>
<loc>https://immotogo.be/fr/destination/la-douane</loc>
</url>
<url>
<loc>https://immotogo.be/en/destination/la-douane</loc>
</url>
</urlset>
Answered by fuma 💙 joulev
Alright I've just read the whole docs again
You can either generate one via Route Handler, with an XML generator (find a library), or manually write a sitemap.xml

If you directly list urls without locale (for example, /my-blog/name), ensure that each page has alternate tags (alternates.languages and alternates.canoncal) so that Google know all variants of your page. In this case, you can directly use the built-in Sitemap Route API
View full answer

28 Replies

Avatar
RuwbixOP
should i define somewhere that my base url redirects to the language?
Avatar
fuma 💙 joulev
You should add a xhtml:link element with hreflang attribute according to their docs:
https://developers.google.com/search/docs/specialty/international/localized-versions#sitemap
it's similar to the alternate meta tag
Avatar
RuwbixOP
I don't think nextjs MetadataRoute.Sitemap has a built-in feature for that, does it?

import { siteConfig } from '@/config/site';
import { i18n } from '@/i18n-config';
import { MetadataRoute } from 'next';

export default function sitemap(): MetadataRoute.Sitemap {
  const BASE_URL = siteConfig.url || 'https://immotogo.be';

  const defaultRoutes: MetadataRoute.Sitemap = i18n.locales.map((locale) => ({
    url: `${BASE_URL}/${locale}`,
  }));

  const gernRoutes: MetadataRoute.Sitemap = i18n.locales.map((locale) => ({
    url: `${BASE_URL}/${locale}/destination/gern`,
  }));

  const laDouaneRoutes: MetadataRoute.Sitemap = i18n.locales.map((locale) => ({
    url: `${BASE_URL}/${locale}/destination/la-douane`,
  }));

  return [...defaultRoutes, ...gernRoutes, ...laDouaneRoutes];
}
probably easier to just manually make a sitemap.xml in this case?
or does it auto do that when I set it up in metadata?
Image
Avatar
fuma 💙 joulev
Google docs didn't describe that, defining alternates in page level might be supported.

Assume you're using https://github.com/iamvishnusankar/next-sitemap, I think it can be implemented with the alternateRefs option
Avatar
risky
i think they are using: https://nextjs.org/docs/app/api-reference/file-conventions/metadata/sitemap#generate-a-sitemap (based on the imports in codeblock)
Avatar
fuma 💙 joulev
I haven't checked this new API before, surely it doesn't support langhref attribute for now
Avatar
risky
doesn't look like it
[only the basic stuff is supported](https://github.com/vercel/next.js/blob/9b2f29ebaf5add67cec0cac7296f9e64567b3fb4/packages/next/src/build/webpack/loaders/metadata/resolve-route-data.ts#L46-L78)
Avatar
fuma 💙 joulev
and perhaps Next.js won't be that smart, since sitemap is at the root directory of your website, it isn't able to get metadata from url and generate alternates for you
Avatar
risky
i think you can actually put a sitemap in a non-root path, at least some canarys ago you could (so as it isn't mentioned in docs, i wouldn't trust that much)
Avatar
fuma 💙 joulev
that's by Google's docs
Avatar
risky
ohhhhhh i was meaning the nextjs docs where it mentioned only root sitemap.ts was used
Avatar
fuma 💙 joulev
Google only look for xxx.com/sitemap.xml, subdirectories are not considered
Avatar
risky
yeah, i think you may have success importing them through the sitemap or robots.. but i don't know that much SEO (so best to just use root imo)
Avatar
fuma 💙 joulev
Alright I've just read the whole docs again
You can either generate one via Route Handler, with an XML generator (find a library), or manually write a sitemap.xml

If you directly list urls without locale (for example, /my-blog/name), ensure that each page has alternate tags (alternates.languages and alternates.canoncal) so that Google know all variants of your page. In this case, you can directly use the built-in Sitemap Route API
Answer
Avatar
RuwbixOP
so like this

<?xml version="1.0" encoding="UTF-8"?>
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
    <url>
        <loc>https://immotogo.be/</loc>
        <xhtml:link rel="alternate" hreflang="nl" href="https://immotogo.be/nl"/>
        <xhtml:link rel="alternate" hreflang="fr" href="https://immotogo.be/fr"/>
        <xhtml:link rel="alternate" hreflang="en" href="https://immotogo.be/en"/>
    </url>
    <url>
        <loc>https://immotogo.be/destination/gern</loc>
        <xhtml:link rel="alternate" hreflang="nl" href="https://immotogo.be/nl/destination/gern"/>
        <xhtml:link rel="alternate" hreflang="fr" href="https://immotogo.be/fr/destination/gern"/>
        <xhtml:link rel="alternate" hreflang="en" href="https://immotogo.be/en/destination/gern"/>
    </url>
    <url>
        <loc>https://immotogo.be/destination/la-douane</loc>
        <xhtml:link rel="alternate" hreflang="nl" href="https://immotogo.be/nl/destination/la-douane"/>
        <xhtml:link rel="alternate" hreflang="en" href="https://immotogo.be/en/destination/la-douane"/>
        <xhtml:link rel="alternate" hreflang="fr" href="https://immotogo.be/fr/destination/la-douane"/>
    </url>
</urlset>
Avatar
fuma 💙 joulev
it looks good
Avatar
RuwbixOP
doesn't seem to like the <xhtml:link />
Image
Avatar
fuma 💙 joulev
xmlns:xhtml="http://www.w3.org/1999/xhtml"
at urlset
Avatar
RuwbixOP
alright, it doesn't return it in a formatted list anymore. That an issue?
Image
Image
looks fine in source code though, just doesn't seem to like those xhtml:link element. is there like tools to check if my sitemap is valid?
Avatar
fuma 💙 joulev
it's fine
Avatar
risky
i have it rendering weird often
Avatar
RuwbixOP
alright awesome. Thanks a lot guys