simadzu’blog

しめじの代わりになめこを入れたらねっとり焼きそばになった。失敗。

はてなブログのトップページに「前のページ」リンクを設置した

hatenaロゴ

はてなブログでは、カテゴリーや月別アーカイブには、前のページに戻るリンクがあるのですが、なぜか、トップページには、前に戻るリンクがなく、ブラウザの戻るボタンで戻るしかありません。

そこで、JavaScript(jQuery)で「前のページ」リンクを設置してみることにしました。

(デザイン→カスタマイズ→フッタにコードを入力)

JavaScript
<script>
document.addEventListener('DOMContentLoaded', function() {
    if(document.referrer.indexOf(document.domain) > -1) { /* 自分のブログからきたら↓ */
        if($('.page-index')[0]) { /* トップページなら↓ */
            if(location.search) { /* 「?page=」があるなら↓ */
                var str_prev = '<span class="pager-prev"><a href="javascript:void(0);" onClick="history.back(); return false;">前のページ</a></span>';
                if($('.pager-next')[0]) { /* 次のページリンクがあったら↓ */
                    $('.pager').prepend(str_prev); /* 前のページリンクを設置 */
                }
                else { /* 次のページリンクもないなら↓ */
                    var str_html = '<div class="pager autopagerize_insert_before">' + str_prev + '</div>';
                    $('#main-inner').append(str_html); /* 前のページリンクと次のページリンクを設置 */
                }
            }
        }
    }
});
</script>
      何もしない(「前のページ」リンクを設置しない)場合
  • 自分のブログのリンク以外(検索やブックマーク)からきたとき
  • カテゴリーや月別アーカイブ(はじめから「前のページ」リンクがあるので)
  • 個別記事やトップページの1ページ目(アドレスに「?page=」がないページ)、aboutページ、「404 Not Found」のページ、検索結果のページ
      「前のページ」リンクを設置する場合
    • 自分のブログのリンクからきたとき
    • トップページの2ページ目以降
    • ※ 「前のページ」リンクのクリックでブラウザ履歴の1つ前のページに戻る処理を実行

基本的にコピペしかできない素人が、わかってないで書いてるところがありますので、説明に間違いがあったらごめんなさい...。

参考になるブログ・Webサイト
IMUZA.com - はてなブログ:【決定版】記事一覧に「前のページ」ボタンを実装
まろりかモンスター - はてなブログの記事一覧に「前のページ」ボタンを追加する方法【コピペOK】
Plain Note - 【はてなブログ】トップページの2ページ目以降に「前に戻る」を付ける

- 追記 -
「前のページ」に戻るリンクなんかいらない