読者です 読者をやめる 読者になる 読者になる

clock-up-blog

go-mi-tech

はてなブログ:カテゴリのリンク先を常に記事サマリ一覧にする

はてなブログ JavaScript

カテゴリのリンクの挙動を統一したい

カテゴリのリンクが押されたら常に

  • 記事本文一覧ではなく
  • 記事サマリ一覧が

出て欲しい。

右サイドに表示されるカテゴリのリンク

f:id:kobake:20140505122943p:plain

記事サマリ一覧(/archive/category/~)に飛んでくれる。
f:id:kobake:20140505123719p:plain

記事名直下にあるカテゴリのリンク

f:id:kobake:20140505123605p:plain

記事本文一覧(/category/~)に飛んでしまう。
f:id:kobake:20140505123934p:plain

うちのブログは無駄に巨大な記事が多いので、記事本文一覧(/category/~)は見通しが悪いのです。
常に記事サマリ一覧(/archive/category/~)に飛ばしたい。

スクリプトで対応

以下スクリプトを実行するように設定。jQuery をインクルードしている前提。
リンク先差し替えるついでに、カテゴリの記事件数も表示するようにしちゃってます。

// -- -- カテゴリリンクの差し替え -- -- //
$(function(){
  // リンク名漁る(括弧付きの名前を取得する)
  var texts = {};
  $('a[href*="/category/"').each(function(){
    var text = $(this).text().replace(/^\s+/, "").replace(/\s+$/, "");
    var href = $(this).attr("href");
    if(text.indexOf("(") >= 0){
      texts[href] = text;
    }
  });
  // リンク差し替え(名前も差し替え)
  $('a[href*="/category/"').each(function(){
    var href = $(this).attr("href");
    // リンク差し替え
    if(href.indexOf("archive/category/") == -1){
      href = href.replace("/category/", "/archive/category/");
      $(this).attr("href", href);
    }
    // 差し替え対象の名前があれば差し替え
    if($(this).text().indexOf("(") == -1){
      var text = texts[href];
      if(text){
        $(this).text(text);
      }
    }
  });
});

スクリプト設置の仕方

管理画面で「デザイン」をカスタマイズします。
f:id:kobake:20140505124705p:plain:w300

「ヘッダ」の「タイトル下」の HTML のところにスクリプトを書けます。
f:id:kobake:20140505124709p:plain:w500
f:id:kobake:20140505125212p:plain:w500

結果

記事名直下のカテゴリのリンクが、記事サマリ一覧(/archive/category/~)に差し替わりました。
ついでに、カテゴリの記事件数も表示されるようになりました。
f:id:kobake:20140505130220p:plain

なんだか仰々しい気がする

これスクリプトでやるようなことか?という疑問符が常に頭にある。

目を皿のようにしてはてなブログの設定画面を眺めたんだけど、
今回の目的を満たすような設定項目が見つからなかったので、スクリプトで無理やり対処しました。
もっとスマートなやり方があれば教えて欲しいです。

});