@astrojs/ sitemap

Esta integración de Astro genera un sitemap basado en tus páginas cuando construyes tu proyecto de Astro.

Por qué Astro Sitemap

Un Sitemap es un archivo XML que describe todas las páginas, videos y archivos de tu sitio. Los motores de búsqueda como Google leen este archivo para rastrear tu sitio de manera más eficiente. Consulta los consejos de Google sobre sitemaps para aprender más.

Se recomienda un archivo sitemap para sitios grandes con múltiples páginas. Si no usas un sitemap, la mayoría de los motores de búsqueda podrán listar las páginas de tu sitio, pero un sitemap es una excelente manera de asegurar que tu sitio sea lo más amigable posible para los motores de búsqueda.

Con Astro Sitemap, no tienes que preocuparte por crear este archivo XML tú mismo: la integración de Astro Sitemap rastreará tus rutas generadas estáticamente y creará el archivo sitemap, incluyendo rutas dinámicas como [...slug] o src/pages/[lang]/[version]/info.astro generadas por getStaticPaths().

Esta integración no puede generar entradas de sitemap para rutas dinámicas en modo SSR.

Instalación

Astro incluye un comando astro add para automatizar la configuración de las integraciones oficiales. Si lo prefieres, puedes instalar las integraciones manualmente en su lugar.

Ejecuta uno de los siguientes comandos en una nueva ventana de terminal.

npx astro add sitemap

pnpm astro add sitemap

yarn astro add sitemap

Si tienes algún problema, no dudes en informarnos en GitHub e intenta los pasos de instalación manual a continuación.

Instalación manual

Primero, instala el paquete @astrojs/sitemap usando tu gestor de paquetes.

npm install @astrojs/sitemap

pnpm add @astrojs/sitemap

yarn add @astrojs/sitemap

Luego, aplica la integración a tu archivo astro.config.* usando la propiedad integrations:

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

export default defineConfig({
  // ...
  integrations: [sitemap()],
});

Uso

@astrojs/sitemap necesita conocer la URL desplegada de tu sitio para generar un sitemap.

Añade la URL de tu sitio como la opción site en astro.config.mjs. Debe comenzar con http:// o https://.

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

export default defineConfig({
  site: 'https://example.com',
  integrations: [sitemap()],
  // ...
});

Con la integración de sitemap configurada, los archivos sitemap-index.xml y sitemap-0.xml se añadirán a tu directorio de salida al construir tu sitio.

sitemap-index.xml enlaza a todos los archivos sitemap numerados. sitemap-0.xml lista las páginas de tu sitio. Para sitios extremadamente grandes, también puede haber archivos numerados adicionales como sitemap-1.xml y sitemap-2.xml.

Ejemplo de archivos generados para un sitio web de dos páginas

<?xml version="1.0" encoding="UTF-8"?>
  <sitemapindex xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
  <sitemap>
    <loc>https://example.com/sitemap-0.xml</loc>
  </sitemap>
</sitemapindex>

<?xml version="1.0" encoding="UTF-8"?>
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9" xmlns:news="http://www.google.com/schemas/sitemap-news/0.9" xmlns:xhtml="http://www.w3.org/1999/xhtml" xmlns:image="http://www.google.com/schemas/sitemap-image/1.1" xmlns:video="http://www.google.com/schemas/sitemap-video/1.1">
  <url>
    <loc>https://example.com/</loc>
  </url>
  <url>
    <loc>https://example.com/second-page/</loc>
  </url>
</urlset>

Descubrimiento de sitemap

Puedes facilitar que los crawlers encuentren tu sitemap con enlaces en el <head> de tu sitio y en el archivo robots.txt.

Enlace del sitemap en `<head>`

Añade un elemento <link rel="sitemap"> al <head> de tu sitio apuntando al archivo índice del sitemap:

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

Enlace del sitemap en `robots.txt`

Si tienes un robots.txt para tu sitio web, puedes añadir la URL del índice del sitemap para ayudar a los crawlers:

User-agent: *
Allow: /

Sitemap: https://<YOUR SITE>/sitemap-index.xml

Si quieres reutilizar el valor de site de astro.config.mjs, también puedes generar robots.txt dinámicamente. En lugar de usar un archivo estático en el directorio public/, crea un archivo src/pages/robots.txt.ts y añade el siguiente código:

import type { APIRoute } from 'astro';

const getRobotsTxt = (sitemapURL: URL) => `\
User-agent: *
Allow: /

Sitemap: ${sitemapURL.href}
`;

export const GET: APIRoute = ({ site }) => {
  const sitemapURL = new URL('sitemap-index.xml', site);
  return new Response(getRobotsTxt(sitemapURL));
};

Configuración

Para configurar esta integración, pasa un objeto a la función sitemap() en astro.config.mjs.

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

export default defineConfig({
  integrations: [
    sitemap({
      // configuration options
    }),
  ],
});

`filter()`

Type: (page: string) => boolean

Todas las páginas se incluyen en tu sitemap por defecto. Al añadir una función filter() personalizada, puedes filtrar las páginas incluidas por URL.

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

export default defineConfig({
  site: 'https://example.com',
  integrations: [
    sitemap({
      filter: (page) => page !== 'https://example.com/secret-vip-lounge/',
    }),
  ],
});

La función será llamada por cada página de tu sitio. El parámetro de función page es la URL completa de la página actualmente en consideración, incluyendo tu dominio site. Devuelve true para incluir la página en tu sitemap, y false para excluirla.

Para filtrar múltiples páginas, añade argumentos con las URLs objetivo.

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

export default defineConfig({
  site: 'https://example.com',
  integrations: [
    sitemap({
      filter: (page) =>
        page !== 'https://example.com/secret-vip-lounge-1/' &&
        page !== 'https://example.com/secret-vip-lounge-2/' &&
        page !== 'https://example.com/secret-vip-lounge-3/' &&
        page !== 'https://example.com/secret-vip-lounge-4/',
    }),
  ],
});

`customPages`

Type: string[]

Un array de páginas generadas externamente para incluir en el archivo sitemap generado.

Usa esta opción para incluir en tu sitemap páginas que son parte de tu sitio desplegado pero no son creadas por Astro.

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

export default defineConfig({
  site: 'https://example.com',
  integrations: [
    sitemap({
      customPages: ['https://example.com/external-page1', 'https://example.com/external-page2'],
    }),
  ],
});

`customSitemaps`

Type: string[]
Default: []

Añadido en: @astrojs/sitemap@3.5.0

Un array de sitemaps generados externamente para incluir en el archivo sitemap-index.xml junto con las entradas de sitemap generadas.

Usa esta opción para incluir sitemaps externos en el archivo sitemap-index.xml creado por Astro para secciones de tu sitio desplegado que tienen sus propios sitemaps no creados por Astro. Esto es útil cuando alojas múltiples servicios bajo el mismo dominio.

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

export default defineConfig({
  site: 'https://example.com',
  integrations: [
    sitemap({
      customSitemaps: ['https://example.com/blog/sitemap.xml', 'https://example.com/shop/sitemap.xml'],
    }),
  ],
});

`entryLimit`

Type: number
Default: 45000

El número máximo de entradas por archivo sitemap. El valor predeterminado es 45000. Se crea un índice de sitemap y múltiples sitemaps si tienes más entradas. Consulta esta explicación sobre cómo dividir un sitemap grande.

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

export default defineConfig({
  site: 'https://example.com',
  integrations: [
    sitemap({
      entryLimit: 10000,
    }),
  ],
});

`changefreq`, `lastmod`, y `priority`

Type: { changefreq?: ChangeFreq; lastmod?: Date; priority?: number; }

Añadido en: @astrojs/sitemap@0.2.0

Estas opciones corresponden a las etiquetas <changefreq>, <lastmod>, y <priority> en la especificación XML de Sitemap.

Ten en cuenta que changefreq y priority son ignorados por Google.

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

export default defineConfig({
  site: 'https://example.com',
  integrations: [
    sitemap({
      changefreq: 'weekly',
      priority: 0.7,
      lastmod: new Date('2022-02-24'),
    }),
  ],
});

`serialize()`

Tipo: (item: SitemapItem) => SitemapItem | Promise<SitemapItem | undefined> | undefined

Genera una representación editable de cada entrada del sitemap antes de devolver un SitemapItem o undefined para eliminarla del sitemap. Esta función puede ser asíncrona y se llama para cada entrada del sitemap justo antes de escribir en disco.

El siguiente ejemplo filtra una página del sitemap y actualiza una entrada específica para modificar sus propiedades changefreq, lastmod, y priority:

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

export default defineConfig({
  site: 'https://example.com',
  integrations: [
    sitemap({
      serialize(item) {
        if (/exclude-from-sitemap/.test(item.url)) {
          return undefined;
        }
        if (/your-special-page/.test(item.url)) {
          item.changefreq = ChangeFreqEnum.DAILY;
          item.lastmod = new Date().toISOString();
          item.priority = 0.9;
        }
        return item;
      },
    }),
  ],
});

`chunks`

Type: Record<string, (item: SitemapItem) => SitemapItem | undefined>

Añadido en: @astrojs/sitemap@3.7.0 Nuevo

Un mapa de funciones que te permite dividir tu sitemap en múltiples archivos basándote en lógica personalizada. Cada clave en el objeto se convierte en el nombre de un archivo sitemap separado, y su función correspondiente determina qué URLs se incluirán en ese fragmento. Esto puede ser útil, por ejemplo, si una sección específica de tu sitio web cambia con mucha frecuencia y te gustaría especificar una frecuencia de cambio diferente para sus entradas.

Cada función chunk recibe un SitemapItem y para cada elemento devuelve:

el SitemapItem modificado, si la URL debe incluirse en este fragmento
undefined, si la URL no debe incluirse en este fragmento

El ejemplo a continuación muestra cómo dividir URLs en diferentes archivos sitemap según su ruta:

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

export default defineConfig({
  site: 'https://example.com',
  integrations: [
    sitemap({
      chunks: {
        'blog': (item) => {
          if (/blog/.test(item.url)) {
            item.changefreq = ChangeFreqEnum.WEEKLY;
            item.lastmod = new Date().toISOString();
            item.priority = 0.9;
            return item;
          }
        },
        'glossary': (item) => {
          if (/glossary/.test(item.url)) {
            item.changefreq = ChangeFreqEnum.MONTHLY;
            item.lastmod = new Date().toISOString();
            item.priority = 0.7;
            return item;
          }
        }
      },
    }),
  ],
});

Esta configuración generará los siguientes archivos:

sitemap-blog-0.xml
sitemap-glossary-0.xml

Las URLs que no coincidan con ningún fragmento se colocarán en un archivo predeterminado sitemap-pages-0.xml.

`i18n`

Tipo: { defaultLocale: string; locales: Record<string, string>; }

Para localizar un sitemap, pasa un objeto a esta opción i18n.

Este objeto tiene dos propiedades obligatorias:

defaultLocale: Su valor debe existir como una de las claves de locales.
locales: pares clave/valor. La clave se usa para buscar una parte de locale en una ruta de página. El valor es un atributo de idioma, solo se permiten el alfabeto inglés y el guion.

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

export default defineConfig({
  site: 'https://example.com',
  integrations: [
    sitemap({
      i18n: {
        defaultLocale: 'en', // All urls that don't contain `es` or `fr` after `https://example.com/` will be treated as default locale, i.e. `en`
        locales: {
          en: 'en-US', // The `defaultLocale` value must present in `locales` keys
          es: 'es-ES',
          fr: 'fr-CA',
        },
      },
    }),
  ],
});

El sitemap resultante se ve así:

...
  <url>
    <loc>https://example.com/</loc>
    <xhtml:link rel="alternate" hreflang="en-US" href="https://example.com/"/>
    <xhtml:link rel="alternate" hreflang="es-ES" href="https://example.com/es/"/>
    <xhtml:link rel="alternate" hreflang="fr-CA" href="https://example.com/fr/"/>
  </url>
  <url>
    <loc>https://example.com/es/</loc>
    <xhtml:link rel="alternate" hreflang="en-US" href="https://example.com/"/>
    <xhtml:link rel="alternate" hreflang="es-ES" href="https://example.com/es/"/>
    <xhtml:link rel="alternate" hreflang="fr-CA" href="https://example.com/fr/"/>
  </url>
  <url>
    <loc>https://example.com/fr/</loc>
    <xhtml:link rel="alternate" hreflang="en-US" href="https://example.com/"/>
    <xhtml:link rel="alternate" hreflang="es-ES" href="https://example.com/es/"/>
    <xhtml:link rel="alternate" hreflang="fr-CA" href="https://example.com/fr/"/>
  </url>
  <url>
    <loc>https://example.com/es/second-page/</loc>
    <xhtml:link rel="alternate" hreflang="es-ES" href="https://example.com/es/second-page/"/>
    <xhtml:link rel="alternate" hreflang="fr-CA" href="https://example.com/fr/second-page/"/>
    <xhtml:link rel="alternate" hreflang="en-US" href="https://example.com/second-page/"/>
  </url>
...

`xslURL`

Type: string

Añadido en: @astrojs/sitemap@3.2.0

La URL de una hoja de estilo XSL para estilizar y embellecer tu sitemap.

El valor establecido puede ser una ruta relativa a tu URL site configurada para una hoja de estilo local, o puede ser un enlace URL absoluto a una hoja de estilo externa.

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

export default defineConfig({
  site: 'https://example.com',
  integrations: [
    sitemap({
      xslURL: '/sitemap.xsl'
    }),
  ],
});

`filenameBase`

Type: string
Default: sitemap

Añadido en: @astrojs/sitemap@3.4.0

La cadena de prefijo de nombre usada al generar los archivos XML del sitemap. El valor predeterminado es sitemap.

Esta opción puede ser útil al integrar un sitio de Astro en un dominio con archivos sitemap preexistentes.

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

export default defineConfig({
  site: 'https://example.com',
  integrations: [
    sitemap({
      filenameBase: 'astronomy-sitemap'
    }),
  ],
});

La configuración dada generará archivos sitemap en https://example.com/astronomy-sitemap-0.xml y https://example.com/astronomy-sitemap-index.xml.

`namespaces`

Tipo: { news?: boolean; xhtml?: boolean; image?: boolean; video?: boolean; }
Predeterminado: { news: true, xhtml: true, image: true, video: true }

Añadido en: @astrojs/sitemap@3.6.0

Un objeto de espacios de nombres XML para excluir del sitemap generado.

Excluir los espacios de nombres no utilizados puede ayudar a crear sitemaps más enfocados que son más rápidos de analizar para los motores de búsqueda y usan menos ancho de banda. Por ejemplo, si tu sitio no tiene contenido de noticias, videos o múltiples idiomas, puedes excluir esos espacios de nombres para reducir el exceso de XML.

Por defecto, todos los espacios de nombres configurables (news, xhtml, image, y video) se incluyen en tu XML de sitemap generado. Para excluir uno o más de estos espacios de nombres de la generación de tu sitemap, añade un objeto de configuración namespaces y establece opciones individuales en false:

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

export default defineConfig({
  site: 'https://example.com',
  integrations: [
    sitemap({
      namespaces: {
        news: false,
        xhtml: false,
      }
    })
  ]
});

Referencia de utilidades de Astro Sitemap

import {
  ChangeFreqEnum,
} from "@astrojs/sitemap";

`ChangeFreqEnum`

Añadido en: @astrojs/sitemap@1.3.2

Una enumeración de TypeScript donde cada clave es la versión en mayúsculas de un valor válido definido en la especificación de <changefreq>.

El siguiente ejemplo usa serialize() para actualizar el changefreq del índice del blog:

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

export default defineConfig({
  site: 'https://example.com',
  integrations: [
    sitemap({
      serialize(item) {
        if (/blog/.test(item.url)) {
          item.changefreq = ChangeFreqEnum.DAILY;
        }

        return item;
      },
    }),
  ],
});

Referencia de tipos de Astro Sitemap

import type {
  ChangeFreq,
  LinkItem,
  SitemapItem,
  SitemapOptions,
} from "@astrojs/sitemap";

`ChangeFreq`

Una unión de valores válidos para especificar la frecuencia de actualización de una entrada.

`LinkItem`

Type: { lang: string; hreflang?: string; url: string; }

Describe la URL de una página. Puede ser la versión predeterminada del documento o una de sus traducciones.

`LinkItem.lang`

Type: string

Especifica el código de idioma soportado por esta versión de la página. Cuando se establece un valor, no necesitas establecer también hreflang.

`LinkItem.hreflang`

Type: string

Especifica el código de idioma soportado por esta versión de la página. Cuando se establece un valor, no necesitas establecer también lang.

`LinkItem.url`

Type: string

Especifica la URL absoluta de la página para el idioma especificado.

`SitemapItem`

Tipo: { url: string; lastmod?: string | undefined; changefreq?: ChangeFreqEnum | undefined; priority?: number | undefined; links?: LinkItem[] | undefined; }

Describe una entrada en un sitemap. Contiene su url y propiedades opcionales adicionales.

`SitemapItem.url`

Type: string

Especifica la URL absoluta de la página.

`SitemapItem.lastmod`

Type: string | undefined

Define la fecha de última modificación de la página con formato ISO como una cadena.

`SitemapItem.changefreq`

Type: ChangeFreqEnum | undefined

Define con qué frecuencia es probable que cambie la página.

`SitemapItem.priority`

Type: number | undefined

Define la prioridad de esta URL relativa a otras URLs en tu sitio. El valor debe ser un número en el rango de 0.0 a 1.0.

`SitemapItem.links`

Type: LinkItem[] | undefined

Define una lista de páginas alternativas, incluyendo la página actual.

`SitemapOptions`

Type: object

Describe las opciones de configuración.

Ejemplos

El sitio web oficial de Astro usa Astro Sitemap para generar su sitemap.
¡Explora proyectos con Astro Sitemap en GitHub para más ejemplos!

Más integraciones

Frameworks de front-end

Adaptadores

Otras integraciones

Contribuir Comunidad Patrocinar

@astrojs/ sitemap

Por qué Astro Sitemap

Instalación

Instalación manual

Uso

Descubrimiento de sitemap

Enlace del sitemap en <head>

Enlace del sitemap en robots.txt

Configuración

filter()

customPages

customSitemaps

entryLimit

changefreq, lastmod, y priority

serialize()

chunks

i18n

xslURL

filenameBase

namespaces

Referencia de utilidades de Astro Sitemap

ChangeFreqEnum

Referencia de tipos de Astro Sitemap

ChangeFreq

LinkItem

LinkItem.lang

LinkItem.hreflang

LinkItem.url

SitemapItem

SitemapItem.url

SitemapItem.lastmod

SitemapItem.changefreq

SitemapItem.priority

SitemapItem.links

SitemapOptions

Ejemplos

Más integraciones

Frameworks de front-end

Adaptadores

Otras integraciones

Enlace del sitemap en `<head>`

Enlace del sitemap en `robots.txt`

`filter()`

`customPages`

`customSitemaps`

`entryLimit`

`changefreq`, `lastmod`, y `priority`

`serialize()`

`chunks`

`i18n`

`xslURL`

`filenameBase`

`namespaces`

`ChangeFreqEnum`

`ChangeFreq`

`LinkItem`

`LinkItem.lang`

`LinkItem.hreflang`

`LinkItem.url`

`SitemapItem`

`SitemapItem.url`

`SitemapItem.lastmod`

`SitemapItem.changefreq`

`SitemapItem.priority`

`SitemapItem.links`

`SitemapOptions`