太陽がまぶしかったから

C'etait a cause du soleil.

はてなブログに言及一覧(トラックバック)機能を拡張するブログパーツを作ったよ

トラックバックの復活

 はてなブログの醍醐味のひとつとして、ブログ同士の言及があって、例えば誰かが問題提起をした記事について別の人が掘り下げたり、自分自身のケースを考えたり、唐突に手斧を投げたりしていくうちに議論が深まっていくことがあります。他のブログからの言及を受けるとダッシュボードに通知が来たり、アクセス解析の画面に表示されるのですが、その記事を読んだ人に「こういう言及があった」と直接的に知らせる事ができません。

 このため、言及された側の記事上に言及した記事の一覧を自動表示させると捗ります。これは、 はてなダイアリーにも「トラックバック」として実装されていた機能なのですが、はてなブログになってからは id:jkondo 氏の意向で削除されてしまったため、勝手に復活させることにしました。その辺の経緯については以下を参照してください。約1年前の出来事だったのか。

バージョンアップ内容

 閑話休題。今回作ったのは、その時のプログラムのバージョンアップ版となります。主な変更点は以下の通りです。

  • はてなブログカード表示形式
  • 「この記事に言及する」機能の付与*1
  • 言及記事がない場合はその旨を表示
  • 関数化を行いグローバル変数を利用しない
  • ブログURLの変数変更などの個別カスタマイズを前提としない
  • 外部ライブラリ化により設置作業を簡略化
  • 高速化・安定化(多分)

スクリプト設置

f:id:bulldra:20140814125828p:plain

 デザイン画面における「記事下」の部分に設置します。

<span id="trackback_entry" class="hatena-module-foot"></span>

<script src="https://www.google.com/jsapi"></script>
<script src="http://bulldra.github.io/commons.js" charset="utf-8"></script>
<script src="http://bulldra.github.io/trackback.js" charset="utf-8"></script>

 『GitHub Pages』を利用しての外部ライブラリ化を行ったので設置作業の簡略化とサーバーサイドでのバージョン一元管理が行われるようになりました。『当ブログで配布していた「あわせて読みたいウィジット」がSEOスパムになっている可能性があるため差し替えをお願いします - 太陽がまぶしかったから』の問題も、外部ライブラリ化がされていれば簡単に対応できたのですが、当時はそこまで気が回りませんでした。既存のスクリプトについても外部ライブラリ化を行っていきます*2

 個別カスタマイズを行う場合には『bulldra.github.io/trackback.js at master · bulldra/bulldra.github.io · GitHub』から取得してカスタマイズしたものを設置して下さい。

スマートフォン表示対応

f:id:bulldra:20140814125843p:plain

 スマートフォン表示でも使う場合には「スマートフォンタブ」で「PCと同じHTMLを表示する」を選択するか、スマートフォン用の「記事下」にも設置します。

f:id:bulldra:20141010083040j:plain

制限事項

 本スクリプトには以下の制限事項があります。仮にSEOへの悪影響や誤動作などの問題があった場合については自己責任の原則でお願いします。

  • はてなブックマークの機能を利用するため、ブックマークがない記事への言及は表示されない
  • はてなブログ、はてなダイアリーからの言及のみ表示
  • はてなダイアリーのブログカードは綺麗じゃない
  • 言及した記事が削除されてもはてなブックマーク側が保持していると空白表示になる
  • はてな側の仕様変更に弱い

 スクリプトに関する個別の設置サポートやカスタマイズ等のご依頼については、『課金アイテム』を利用頂いておりますが、bulldra@gmail.com までご相談下さい。関係ないけど本日は軟骨ライスの日誕生日です。

まとめ

 はてなブログの言及文化は、むしろ強まっているように感じているのですが、未だにトラックバック機能を実装してくれないのでDIYしました。公式対応してもらえるのが一番なのですが、「無い物は無理やり作る」の精神を無駄に発揮しました。このブログについても、なにか言及したいことがありましたら、記事下の「>>言及する」をポチッとして言及してもらえると喜びます。

おまけ(昔作ったLT資料)

JavaScript: The Good Parts ―「良いパーツ」によるベストプラクティス

JavaScript: The Good Parts ―「良いパーツ」によるベストプラクティス

*1:hitode909の日記』からのインスパイア

*2:下位互換の問題は悩ましい