はてなブログ間の記事移動はJavascriptとcanonicalでリダイレクト

はてなブログ間の記事移動はJavascriptとcanonicalでリダイレクト

現在、はてなブログで4つのブログを運用しているのですが、そのうちのひとつを別のブログに統合しようと思います。

で、どうやってリダイレクトするかですが、もちろん .htaccess は使えませんので Javascript を使うしかありません。

01今回の条件

はてなブログ間で記事を移動する場合、カテゴリーもそのまま移動するのであれば、移動するブログの 詳細設定 -> headに要素を追加

<script>
location.href = http(s)://移動先ブログのドメイン + location.pathname;
</script>

と入れておけばリダイレクトされます。

ただ、今回の場合、

  • 移動するブログには複数のカテゴリーがあるが、移動先ではひとつのカテゴリーにまとめる
  • トップページ、カテゴリーページ、アーカイブページは、移動先のカテゴリーページにリダイレクトする
  • 記事ページは、移動先記事ページにリダイレクトする

という条件で移動しますので、若干手を加える必要があります。

また、 rel="canonical" ですが、こうした場合に Javascript で差し替えることに効果があるかどうかわかりませんが、やっておいて損はありませんのでやっておきましょう。

02エクスポートした記事ファイルの整形

  1. まず、移動するブログの 設定 -> 詳細設定 -> エクスポート から記事ファイルをダウンロードします。
  2. ファイルをエディタで開き、カテゴリーを削除、修正など、ひとつのカテゴリーに変更します。
  3. 移動先のブログで記事ファイルをインポートします。

03Javascript でのリダイレクト

上記の条件下でリダイレクトする場合の Javascript です。

即時リダイレクト

<script>
if(location.href.indexOf('entry') !== -1){
    var url =  http(s)://移動先ブログのドメイン + location.pathname;
}else{
    var url =  http(s)://移動先ブログのドメイン + '/archive/category/移動先の新しいカテゴリー';
}
document.getElementsByTagName('link')[0].href = url;
location.href = url;
</script>

これは 詳細設定 -> headに要素を追加 に入れても、カスタマイズ -> ヘッダ -> タイトル下 に入れてもいけます。

メッセージ表示後にリダイレクト

<script>
if(location.href.indexOf('entry') !== -1){
    var url =  http(s)://移動先ブログのドメイン + location.pathname;
}else{
    var url =  http(s)://移動先ブログのドメイン + '/archive/category/移動先の新しいカテゴリー';
}
document.getElementsByTagName('link')[0].href = url;
var elem = document.createElement('div');
elem.innerHTML = '当ブログは「' + 移動先のブログ名 + '」に統合しました。<br />5秒後に新しいブログに移動します。';
elem.setAttribute('style', 'width:100vw;height:100vh;padding-top:100px;text-align:center;background:#fff;font-size:20px;font-weight:bold;position:fixed;z-index:9999;');
var parent = document.getElementById('container');
parent.insertBefore(elem, parent.firstChild);


setTimeout(function(){
location.href = url;
}, 5000);
</script>

こちらは カスタマイズ -> ヘッダ -> タイトル下 に入れないと id=container 要素を取得できません。

04適用したサイト

(2019.4.10)カテゴリーを維持したまま移動しようと検討中につき、まだリダイレクトしません。

mankan.hatenablog.jp