@astrojs/ sitemap
このAstroインテグレーションは、Astroプロジェクトをビルドする際に、ページに基づいてサイトマップを生成します。
Astroサイトマップを選ぶ理由
Section titled “Astroサイトマップを選ぶ理由”サイトマップは、サイト上のすべてのページ、動画、ファイルを概説するXMLファイルです。Googleなどの検索エンジンは、このファイルを読み取ってサイトをより効率的にクロールします。サイトマップに関するGoogle自身のアドバイスを参照して、詳細を確認してください。
サイトマップファイルは、大規模な複数ページのサイトに推奨されます。サイトマップを使用しなくても、ほとんどの検索エンジンはサイトのページをリストできますが、サイトマップはサイトを可能な限り検索エンジンフレンドリーにするための優れた方法です。
Astroサイトマップを使用すると、このXMLファイルを手動で作成する必要はありません。Astroサイトマップインテグレーションは、静的に生成されたルートをクロールし、getStaticPaths()によって生成された[...slug]やsrc/pages/[lang]/[version]/info.astroなどの動的ルーティングを含むサイトマップファイルを作成します。
このインテグレーションは、SSRモードで動的ルートのサイトマップエントリを生成できません。
インストール
Section titled “インストール”Astroには、公式インテグレーションのセットアップを自動化するためのastro addコマンドが含まれています。もしよろしければ、手動でインテグレーションをインストールできます。
新しいターミナルウィンドウで次のいずれかのコマンドを実行します。
npx astro add sitemappnpm astro add sitemapyarn astro add sitemap問題が発生した場合は、GitHubで報告してください。そして、以下の手動インストール手順を試してください。
手動インストール
Section titled “手動インストール”まず、パッケージマネージャーを使用して@astrojs/sitemapパッケージをインストールします。
npm install @astrojs/sitemappnpm add @astrojs/sitemapyarn add @astrojs/sitemap次に、integrationsプロパティを使用して、インテグレーションをastro.config.*ファイルに適用します。
import { defineConfig } from 'astro/config';import sitemap from '@astrojs/sitemap';
export default defineConfig({ // ... integrations: [sitemap()],});@astrojs/sitemapは、サイトマップを生成するために、デプロイされたサイトのURLを知る必要があります。
astro.config.mjsのsiteオプションとしてサイトのURLを追加します。これはhttp://またはhttps://で始まる必要があります。
import { defineConfig } from 'astro/config';import sitemap from '@astrojs/sitemap';
export default defineConfig({ site: 'https://stargazers.club', integrations: [sitemap()], // ...});サイトマップインテグレーションを設定すると、サイトをビルドするときに出力ディレクトリにsitemap-index.xmlおよびsitemap-0.xmlファイルが追加されます。
sitemap-index.xmlは、すべての番号付きサイトマップファイルにリンクします。
sitemap-0.xmlは、サイト上のページをリストします。
非常に大規模なサイトの場合、sitemap-1.xmlやsitemap-2.xmlなどの追加の番号付きファイルが存在する場合もあります。
2ページのウェブサイト用に生成されたファイルの例
<?xml version="1.0" encoding="UTF-8"?> <sitemapindex xmlns="http://www.sitemaps.org/schemas/sitemap/0.9"> <sitemap> <loc>https://stargazers.club/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://stargazers.club/</loc> </url> <url> <loc>https://stargazers.club/second-page/</loc> </url></urlset>サイトマップの検出
Section titled “サイトマップの検出”サイトの<head>とrobots.txtファイルにリンクを付けることで、クローラーがサイトマップを見つけやすくなります。
<head>内のサイトマップリンク
Section titled “<head>内のサイトマップリンク”サイトの<head>に、サイトマップインデックスファイルを指す<link rel="sitemap">要素を追加します。
<head> <link rel="sitemap" href="/sitemap-index.xml" /></head>robots.txt内のサイトマップリンク
Section titled “robots.txt内のサイトマップリンク”ウェブサイトにrobots.txtがある場合は、サイトマップインデックスのURLを追加してクローラーを支援できます。
User-agent: *Allow: /
Sitemap: https://<YOUR SITE>/sitemap-index.xmlastro.config.mjsからsiteの値を再利用したい場合は、robots.txtを動的に生成できます。
public/ディレクトリ内の静的ファイルを使用する代わりに、src/pages/robots.txt.tsファイルを作成し、次のコードを追加します。
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));};このインテグレーションを設定するには、astro.config.mjsのsitemap()関数にオブジェクトを渡します。
import { defineConfig } from 'astro/config';import sitemap from '@astrojs/sitemap';
export default defineConfig({ integrations: [ sitemap({ // 設定オプション }), ],});filter
Section titled “filter”デフォルトでは、すべてのページがサイトマップに含まれます。カスタムのfilter関数を追加することで、含まれるページをURLでフィルタリングできます。
import { defineConfig } from 'astro/config';import sitemap from '@astrojs/sitemap';
export default defineConfig({ site: 'https://stargazers.club', integrations: [ sitemap({ filter: (page) => page !== 'https://stargazers.club/secret-vip-lounge/', }), ],});この関数は、サイトのすべてのページに対して呼び出されます。page関数パラメーターは、現在検討中のページの完全なURLであり、siteドメインが含まれます。ページをサイトマップに含めるにはtrueを返し、除外するにはfalseを返します。
複数のページをフィルタリングするには、ターゲットURLを持つ引数を追加します。
import { defineConfig } from 'astro/config';import sitemap from '@astrojs/sitemap';
export default defineConfig({ site: 'https://stargazers.club', integrations: [ sitemap({ filter: (page) => page !== 'https://stargazers.club/secret-vip-lounge-1/' && page !== 'https://stargazers.club/secret-vip-lounge-2/' && page !== 'https://stargazers.club/secret-vip-lounge-3/' && page !== 'https://stargazers.club/secret-vip-lounge-4/', }), ],});customPages
Section titled “customPages”場合によっては、ページがデプロイされたサイトの一部であっても、Astroプロジェクトの一部ではないことがあります。Astroによって作成されてないページをサイトマップに含めたい場合は、このオプションを使用できます。
import { defineConfig } from 'astro/config';import sitemap from '@astrojs/sitemap';
export default defineConfig({ site: 'https://stargazers.club', integrations: [ sitemap({ customPages: ['https://stargazers.club/external-page', 'https://stargazers.club/external-page2'], }), ],});entryLimit
Section titled “entryLimit”サイトマップファイルあたりの最大エントリ数です。デフォルト値は45000です。エントリが多い場合は、サイトマップインデックスと複数のサイトマップが作成されます。大規模なサイトマップの分割に関するこの説明を参照してください。
import { defineConfig } from 'astro/config';import sitemap from '@astrojs/sitemap';
export default defineConfig({ site: 'https://stargazers.club', integrations: [ sitemap({ entryLimit: 10000, }), ],});changefreq、lastmod、およびpriority
Section titled “changefreq、lastmod、およびpriority”これらのオプションは、サイトマップXML仕様の<changefreq>、<lastmod>、および<priority>タグに対応します。
changefreqとpriorityはGoogleによって無視されることに注意してください。
import { defineConfig } from 'astro/config';import sitemap from '@astrojs/sitemap';
export default defineConfig({ site: 'https://stargazers.club', integrations: [ sitemap({ changefreq: 'weekly', priority: 0.7, lastmod: new Date('2022-02-24'), }), ],});serialize
Section titled “serialize”ディスクに書き込む直前に各サイトマップエントリに対して呼び出される関数。この関数は非同期にすることができます。
これらのプロパティを持つSitemapItemオブジェクトをパラメーターとして受け取ります。
url（絶対ページURL）。これはSitemapItemに存在することが保証されている唯一のプロパティです。changefreqlastmod（ISO形式の日付、String型）prioritylinks
このlinksプロパティには、親ページを含む代替ページのLinkItemリストが含まれています。
LinkItem型には2つのフィールドがあります。url（指定された言語のこのページのバージョンの完全修飾URL）とlang（このバージョンのページが対象とするサポートされている言語コード）。
serialize関数は、変更されたかどうかに関係なくSitemapItemを返す必要があります。
以下の例は、サイトマップ固有のプロパティを個別に追加する機能を示しています。
import { defineConfig } from 'astro/config';import sitemap from '@astrojs/sitemap';
export default defineConfig({ site: 'https://stargazers.club', integrations: [ sitemap({ serialize(item) { if (/exclude-from-sitemap/.test(item.url)) { return undefined; } if (/your-special-page/.test(item.url)) { item.changefreq = 'daily'; item.lastmod = new Date(); item.priority = 0.9; } return item; }, }), ],});サイトマップをローカライズするには、このi18nオプションにオブジェクトを渡します。
このオブジェクトには2つの必須プロパティがあります。
defaultLocaleはString。その値はlocalesキーの1つとして存在する必要があります。localesはRecord<String, String>、キー/値のペア。キーはページパス内のロケール部分を検索するために使用されます。値は言語属性であり、英字とハイフンのみが許可されます。
import { defineConfig } from 'astro/config';import sitemap from '@astrojs/sitemap';
export default defineConfig({ site: 'https://stargazers.club', integrations: [ sitemap({ i18n: { defaultLocale: 'en', // `https://stargazers.club/`の後に`es`または`fr`を含まないすべてのURLは、デフォルトのロケール、つまり`en`として扱われます locales: { en: 'en-US', // `defaultLocale`の値は`locales`キーに存在する必要があります es: 'es-ES', fr: 'fr-CA', }, }, }), ],});結果のサイトマップは次のようになります。
... <url> <loc>https://stargazers.club/</loc> <xhtml:link rel="alternate" hreflang="en-US" href="https://stargazers.club/"/> <xhtml:link rel="alternate" hreflang="es-ES" href="https://stargazers.club/es/"/> <xhtml:link rel="alternate" hreflang="fr-CA" href="https://stargazers.club/fr/"/> </url> <url> <loc>https://stargazers.club/es/</loc> <xhtml:link rel="alternate" hreflang="en-US" href="https://stargazers.club/"/> <xhtml:link rel="alternate" hreflang="es-ES" href="https://stargazers.club/es/"/> <xhtml:link rel="alternate" hreflang="fr-CA" href="https://stargazers.club/fr/"/> </url> <url> <loc>https://stargazers.club/fr/</loc> <xhtml:link rel="alternate" hreflang="en-US" href="https://stargazers.club/"/> <xhtml:link rel="alternate" hreflang="es-ES" href="https://stargazers.club/es/"/> <xhtml:link rel="alternate" hreflang="fr-CA" href="https://stargazers.club/fr/"/> </url> <url> <loc>https://stargazers.club/es/second-page/</loc> <xhtml:link rel="alternate" hreflang="es-ES" href="https://stargazers.club/es/second-page/"/> <xhtml:link rel="alternate" hreflang="fr-CA" href="https://stargazers.club/fr/second-page/"/> <xhtml:link rel="alternate" hreflang="en-US" href="https://stargazers.club/second-page/"/> </url>...xslURL
Section titled “xslURL”サイトマップをスタイル設定して見栄えを良くするためのXSLスタイルシートのURL。
設定された値は、ローカルスタイルシートの場合は設定されたsite URLからの相対パス、または外部スタイルシートへの絶対URLリンクのいずれかです。
import { defineConfig } from 'astro/config';import sitemap from '@astrojs/sitemap';
export default defineConfig({ site: 'https://example.com', integrations: [ sitemap({ xslURL: '/sitemap.xsl' }), ],});filenameBase
Section titled “filenameBase”サイトマップXMLファイルを生成するときに使用される名前のプレフィックス文字列。デフォルト値はsitemapです。
このオプションは、Astroサイトを既存のサイトマップファイルを持つドメインに統合する場合に役立つことがあります。
import { defineConfig } from 'astro/config';import sitemap from '@astrojs/sitemap';
export default defineConfig({ site: 'https://stargazers.club', integrations: [ sitemap({ filenameBase: 'astronomy-sitemap' }), ],});指定された設定では、https://stargazers.club/astronomy-sitemap-0.xmlおよびhttps://stargazers.club/astronomy-sitemap-index.xmlにサイトマップファイルが生成されます。
- 公式のAstroウェブサイトは、Astroサイトマップを使用してそのサイトマップを生成しています。
- GitHubでAstroサイトマップを使用したプロジェクトを閲覧するでその他の例をご覧ください！
