はてなブログでnoindexをまとめて設定する！

こんにちわlisです！

今回ははてなブログのページに、noindexを設定するjavascriptについてです！

エントリーには個別に設定できるかもしれませんが、特定のページにまとめて適用することができません。

なのでjavascriptを作成して、特定ページにのみ、まとめて適用できるようにしてみました！

noindexとは？

対象のページに設定すると、Googleの検索インデックス登録をブロックする設定です。

詳細はこちらをどうぞ。

support.google.com

実施内容

javascriptでnoindexするかしないかを判定します。

対象のページであれば、noindexを設定します。

はてなブログでは、noindexを設定できるところがありませんでした。

調べたらjavascriptで設定している例がありました。

判定するロジックをhead要素に組み込めば簡単に設定できるとか考えました。

URLの取得

URLの取得もjavascriptからは簡単に行えるようです。

今回は取り扱うのは

• location.pathname : ホスト名/ドメイン名以降
• location.href : URL全体

の2つです。

location.pathnameだけで事足りるかと思っていました。

しかしアーカイブページによっては、location.pathnameで取ると「/」になってしまうものがあるため、この2つで使い分けることにしました。

noindex対象ページを正規表現で判定

正規表現を使って判定する例です。

今回は「月別アーカイブ」に関する箇所を例に説明します。

URLを取得する

日付でアーカイブされているURLは、下記のような3種類ありました。

• https://www.lisz-works.com/archive/2020
• https://www.lisz-works.com/archive/2020/5
• https://www.lisz-works.com/archive/2020/05/03

これをlocation.pathnameで取得すると

• /archive/2020
• /archive/2020/5
• /archive/2020/05/03

となります。

正規表現のパターン作成

ということで、判定するためのパターンをこんな感じで作成しました。

const pattern = /^\/archive\/\d{4}(\/[01]?\d(\/\d?\d)?)?$/;

正規表現を視覚化した図は、こちらで作成しました。

jex.im

正規表現でチェックする

作成したパターンで、対象のURLか？をチェックします。

こちらでは「location.pathname」を使用します。

const pattern = /^\/archive\/\d{4}(\/[01]?\d(\/\d?\d)?)?$/;
if ( location.pathname.match(pattern) != null ) {
  console.log('対象のURLだよ！');
}

リストでチェックする

正規表現では「特定のパターン」のURLを判定できました。

しかし「特定のURL」という規則性の無いものは判定できません。

なので「対象URLリスト」を作成し、判定していきます。

対象URLリストを作成する

対象の判定用としてこんな感じのリストを作成しました。

const targets = [
  "https://www.lisz-works.com/entry/2016/11/09/192936",
  ...
];

URLリスト内に存在するか？をチェックする

URLリストを作成したので、現在のURLと一致するものがあるかをチェックします。

こちらでは「location.href」を使用します。

const targets = [
  "https://www.lisz-works.com/entry/2016/11/09/192936",
  ...
];
if (0 <= targets.indexOf(location.href)) {
  console.log('対象のURLだよ！');
}

noindex判定処理を作る

ここまでの内容でnoindex判定用関数を作成します。

const pattern = /^\/archive\/\d{4}(\/[01]?\d(\/\d?\d)?)?$/;
const targets = [
  "https://www.lisz-works.com/entry/2016/11/09/192936",
  ...
];

function isTargetURL(path) {
  if ( location.pathname.match(pattern) != null ) {
    return true;
  }
  if (0 <= targets.indexOf(location.href)) {
    return true;
  }
  return false;
}

正規表現とリストによる2つのチェックを関数にまとめただけです。

チェックしてヒットしたらtrue、そうでなければfalseを返します。

noindexを設定する

さて、あとはnoindexにする設定を書くのみです。

先程作成した関数を使って、判定→一致したらnoindex設定をします。

if (isTargetURL(path)) {
  var newMeta = document.createElement("meta");
  newMeta.setAttribute("name","robots");
  newMeta.setAttribute("content","noindex");
  document.getElementsByTagName("head")[0].appendChild(newMeta);
}

はてなブログにnoindex処理を設定

作成したjavascriptを、はてなブログに設定していきます。

ダッシュボードから「設定→詳細設定」に進みます。

「headに要素を追加」に、作成したjavascriptを追加していきます。

<script>
  const pattern = /^\/archive\/\d{4}(\/[01]?\d(\/\d?\d)?)?$/;
  const targets = [
    "https://www.lisz-works.com/entry/2016/11/09/192936",
    ...
  ];

  function isTargetURL(path) {
    if ( location.pathname.match(pattern) != null ) {
      return true;
    }
    if (0 <= targets.indexOf(location.href)) {
      return true;
    }
    return false;
  }

  if (isTargetURL(path)) {
    var newMeta = document.createElement("meta");
    newMeta.setAttribute("name","robots");
    newMeta.setAttribute("content","noindex");
    document.getElementsByTagName("head")[0].appendChild(newMeta);
  }
</script>

参考

コチラを参考にしました。ありがとうございました！

techacademy.jp lab.syncer.jp qiita.com www.marorika.com

あとがき

はてなブログでnoindexをまとめて設定する！でした！

サクッと設定するものがないので、わざわざjavascriptを書かないといけませんでした……

ただ検索したものと、基礎的なものの組み合わせで作成することができました。

あとは状況に応じて、patternとtargetsのリスト内容を更新すれば基本的には今後も使っていくことができます。

よければ参考にしてみてください！