Nuxt.jsで開発したWebAPPにXMLサイトマップを設定する
XMLサイトマップがいかに重要か
そもそも、XMLサイトマップとは何か?
サイトマップは、WEBサイトにどんな情報があるのかを伝える「目次」のような役割をしていると理解していただければ良いでしょう。
XMLサイトマップは、検索エンジンに対してページの情報を伝える役割があります。
XMLサイトマップを設定するメリットを解説します。
1. URLの存在をクローラーに早く検知させる
2. クローラーが検知できないページを知らせる
この2つが主なメリットで、要はSEOに関して欠かせないものです。
1. パッケージのインストール
プロジェクトのルートディレクトリにて下記コマンドを実行し、パッケージをインストールする。
# サイトマップ用パッケージ
$ npm install @nuxtjs/sitemap
2. nuxt.config.js設定を追加する
インストールができたらnuxt.config.jsの設定をしていきます。
まずはmodulesに追加
export default {
,,,
modules: [
'@nuxtjs/sitemap'
]
,,,
}
次にsitemapの設定をしていきます。
例として、下記のように設定にしました。
export default {
,,,
sitemap: {
hostname: 'https://www.example.com',
path: '/sitemap.xml',
cacheTime: 1000 * 60 * 15,
gzip: true,
exclude: [
'/admin',
'/admin/**',
'/works/**'
]
}
,,,
}
3. 各パラメータの説明
hostname
サイトマップを置くサイトのルートドメインを設置する
generateオプションでdirを変更していなければ、distフォルダの中に生成される。
path
サイトマップを生成する場所とファイル名を設定する
cacheTime
サイトマップの更新頻度を設定する。
gzip
gzip形式のsitemapを生成するかどうか
exclude
サイトマップから除外するディレクトリの設定
/**を付けると、そのディレクトリ下を除外することが可能
管理者ページなどがある場合に使用する。
routes
サイトマップに含めるURLの設定
動的ルーティングにて生成されるページ等。(これはまた今度!)
5. 最後に
サイトマップを作ってもロボットにクロールさせないと意味がありません。
いくら素晴らしいページでも、クローラーに見てもらい、インデックスをされなければ、検索エンジンの結果に出てこず、そのページが存在しないのと同じです。
本番でのsitemap.xmlが生成完了していれば、Googleサーチコンソールからサイトマップを送信しましょう!
Author And Source
この問題について(Nuxt.jsで開発したWebAPPにXMLサイトマップを設定する), 我々は、より多くの情報をここで見つけました https://qiita.com/ProjectEchoes-K/items/2003e7cdb0e97e9ba30e著者帰属:元の著者の情報は、元のURLに含まれています。著作権は原作者に属する。
Content is automatically searched and collected through network algorithms . If there is a violation . Please contact us . We will adjust (correct author information ,or delete content ) as soon as possible .