Next.jsで生成したサイトで特定のページのみnoindexを設定する
site:sunday-morning.app でindexされたページを確認したところ、タグに紐づく記事一覧ページが先頭に表示されていた。
記事一覧ページではなく記事詳細ページをindexしてほしいので、記事一覧ページをnoindexで除外することにした。
Headコンポーネントに noIndex propsを受け取れるようにして、 meta name="robots" タグを出し分けるように対応。
// components/Head.tsx
import { default as NextHead } from 'next/head'
import React from 'react'
type Props = {
title: string
description: string
noIndex?: boolean
}
export const Head = ({
title,
description,
noIndex = false,
}: Props) => {
const Robots = () => {
if (noIndex) {
return <meta key="robots" name="robots" content="max-image-preview:large,noindex" />
}
return <meta key="robots" name="robots" content="max-image-preview:large" />
}
return (
<NextHead>
<title>{title || defaultTitle}</title>
<meta key="description" name="description" content={description} />
<Robots />
</NextHead>
)
}あとはタグに紐づく記事一覧ページでHeadを呼び出す際に noIndex={true} を指定する。
// pages/tags/[slug]/posts.tsx
<Head title={title} description={description} noIndex={true} />これで特定のページのみnoindexが付与できるようになった。
また、sitemapを生成する時にタグ紐づく記事一覧ページを含めてしまっていたので、含めないように変更した。
ついでにSearch Consoleのインデックス => 「削除」からインデックスの削除リクエストも出しておいた。
- URL: https://sunday-morning.app/tags/
- 「このプレフィックスで始まる URL をすべて削除」にチェック
次回のクロール時にはnoindexが読み込まれるので、このリクエストが通れば検索結果から消えるはず。