#Sitemap with i18n

1 messages · Page 1 of 1 (latest)

rare owl
#

Hi!, I build a site with two languages English and Español, can you give me an example of how should I use and configure "<@&1055234544183287879>/sitemap" please

terse pelicanBOT
#

Hi @rare owl. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:

#

I'd be happy to help you configure the Astro Sitemap integration for your multilingual site with English and Spanish!

To set up the @astrojs/sitemap integration with i18n support, you'll need to follow these steps:

Installation

First, install the sitemap integration:

npm install @astrojs/sitemap

Configuration

Here's an example configuration for your astro.config.mjs file that includes both English and Spanish:

import { defineConfig } from 'astro/config';
import sitemap from '@astrojs/sitemap';

export default defineConfig({
  site: '<https://yoursite.com',>
  integrations: [
    sitemap({
      i18n: {
        defaultLocale: 'en',  // Your default language
        locales: {
          en: 'en-US',  // The defaultLocale must be present in locales
          es: 'es-ES',
        },
      },
    }),
  ],
  i18n: {
    defaultLocale: 'en',
    locales: ['en', 'es'],
  }
});

This configuration will generate a sitemap that includes alternate language links for each page, helping search engines understand the relationship between your English and Spanish content Sitemap Integration.

Folder Structure

Make sure your project follows the appropriate folder structure for i18n:

src/
  pages/
    index.astro        # English (default) home page
    about.astro        # English about page
    es/
      index.astro      # Spanish home page
      about.astro      # Spanish about page

Generated Sitemap

The integration will generate a sitemap that looks something like this:

#
<url>
  <loc><https://yoursite.com/</loc>>
  <xhtml:link rel="alternate" hreflang="en-US" href="<https://yoursite.com/"/>>
  <xhtml:link rel="alternate" hreflang="es-ES" href="<https://yoursite.com/es/"/>>
</url>
<url>
  <loc><https://yoursite.com/es/</loc>>
  <xhtml:link rel="alternate" hreflang="en-US" href="<https://yoursite.com/"/>>
  <xhtml:link rel="alternate" hreflang="es-ES" href="<https://yoursite.com/es/"/>>
</url>
<url>
  <loc><https://yoursite.com/about/</loc>>
  <xhtml:link rel="alternate" hreflang="en-US" href="<https://yoursite.com/about/"/>>
  <xhtml:link rel="alternate" hreflang="es-ES" href="<https://yoursite.com/es/about/"/>>
</url>

Sitemap Discovery

To help search engines find your sitemap, add a link in your site's <head>:

<head>
  <link rel="sitemap" href="/sitemap-index.xml" />
</head>

You can also reference your sitemap in a robots.txt file:

User-agent: *
Allow: /

Sitemap: <https://yoursite.com/sitemap-index.xml>

For more advanced configuration options, you can check out the Astro Sitemap documentation.

Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: