September 29, 2007

はて☆すた対応しまスター

今ひとつトレンドに乗り切れていない感はありますが、このウェブログもはて☆すたに対応させてみましたよ。

…お約束だけれども、間に☆とか入れるなよ自分。まるで角川じゃないk …という話はさておき、まあ私としても以前から Web 拍手のような仕組みを導入できないかと思っていたのですよ、この blog に。やっぱり内容に興味を持っても、いきなり見ず知らずの他人のエントリにコメントは書きにくいですからね…そういう場合に、おもしろいとか役に立ったとか、その気持ちを☆で伝えていただければ幸いです。

それにしても、今回これを導入するのには無駄に苦労しました。このはてなスターの JavaScript、デフォルトでは h3 要素をタイトル、その中に含まれるリンク (a 要素の href 属性) を Permalink と見なして各エントリに処理を行うのですよ。ところが、私のウェブログはエントリのタイトルを h3 要素としているものの、それがリンクとはなっていなかった。

正直これは悩みました。従来からのスタイルを維持するため、現状の blog テンプレートに対応させる JavaScript を新たに書くか、それとも妥協してデフォルトに合わせるため、自分のテンプレートと CSS を書き換えるか…結論としては後者を選んだのですが、そこでまたもや問題が。一昨日、書き換えたテンプレートを適用してみたところ、スターの出力が全く行われないのです。最初は自分のミスかと思ったのですが、自前で運用し、なおかつデフォルトのはて☆すたを使っていた他の blog を見てみると、やはり表示されていない。

いったいどうなっているのかと思ったら、その日にスクリプトのバージョン アップが行われたようで…どうやら完全にデフォルトのままだと、スターが表示されなくなったみたい。なんて迷惑な変更なんだろうorz

というわけで、デフォルトと同じ挙動となるよう、オリジナルのスクリプトの後に、次のような 1 行を書いた JavaScript を追加。

Hatena.Star.EntryLoader.headerTagAndClassName = ['h3', null];

これで今まで通りに動きます…が、この場合エントリ個別のページの h3 要素にもリンクが含まれていなければ、スターの出力は行われません。でも、個別ページに自分自身へのリンクを入れるのは何か気持ち悪い…というわけで、こんな感じにしてみました。

<script type="text/javascript" src="http://s.hatena.ne.jp/js/HatenaStar.js"></script>
<script type="text/javascript">
Hatena.Star.EntryLoader.headerTagAndClassName = ['h3', null];
Hatena.Star.EntryLoader.loadEntriesByHeader = function() {
  var c = Hatena.Star.EntryLoader;
  if (c.entries) return c.entries;
  var entries = [];
  var headers = c.getHeaders();
  for (var i = 0; i < headers.length; i++) {
    var header = headers[i];
    var a = header.getElementsByTagName('a')[0];
    var cc = c.createCommentContainer();
    header.appendChild(cc);
    var sc = c.createStarContainer();
    header.appendChild(sc);
    entries.push({
      uri: a ? a.href : document.location,
      title: c.scrapeTitle(header),
      star_container: sc,
      comment_container: cc
    });
    if (!a) break;
  }
  c.entries = entries;
  return entries;
}
</script>

これを適用すると、h3 要素に a 要素が含まれていない場合は、表示中のドキュメントの URI を Permalink と見なして処理を行います。つまり、エントリ個別のページでは h3 要素を Permalink にしなくても OK というわけ。

と、ここまで書いて思ったのですけど、こんなスクリプトを用意するくらいなら、ウェブログのテンプレートを書き換えずに最初から JavaScript で対応すべきだった。どうせ以前のデフォルトじゃ現在の HatenaStar.js は動かないんだし。まあ今までの、コメント数の横にまんま Permalink というリンクが並んでいたのも、大多数の人にはクソの役にも立っていなかったわけだし、それを見直せたのだから結果オーライか…エントリのタイトルが Permalink というのは、個人的にはあまり好きじゃないんですけどね。

TrackBacks

  • トラックバック内容 (excerpt) には必ずひらがなを含めてください。入っていない場合は拒否します。
  • このエントリの URI を含まない (リンクしていない) トラックバック元からは受信しません。

Comments

投稿フォーム

  • コメント以外の入力は任意です。
  • コメント文中には必ずひらがなを含めてください。入っていない場合は拒否します。
  • メール アドレスは公開されませんが、URI を入力した場合は名前がリンクとなります。なお、いずれもコメント欄への入力についてはリンクされます。
  • このページの URI をリファラとして送信しない UA からの投稿は受け付けません。