「最近のコメント」欄を実現するための二つの方法。
- Blogger のテンプレートタグを利用して JavaScript に情報を渡し、書き出す方法
- メールから RSS を作成するサービスに、コメント通知メールを送り、そのフィードを JavaScript で表示する方法
以下にそれらの仕組みを用いた、二つの「最近のコメント」導入方法を紹介します。「最近のコメント」を設置したいなと考えている人は、お好きな方を選んで導入してください。
・Farrago Recent Comments Hack
まず最初に紹介するのは、
Farrago Recent Comments Hack 1.03 と呼ばれる有名な方法です。
この方式の「最近のコメント」欄では、コメントの新着順に、投稿者のプロフィールと個別ページへのリンクが表示されます。Big Brother さんの
Unter den Linden で導入されているので、どんな感じになるのか確認されるといいと思います。
この方法の長所は、スクリプト単体で書き出されるため、表示が高速な点です。短所はトップページ以外には掲載できない点、トップページに載っていない記事に対するコメントが反映されない点だと思います。
このコメント一覧リンクの導入方法は、OpenCage さんが詳しい
記事 を書かれていますので、そちらをぜひ参考にしてください。
・クリボウ式「最近のコメント」
二つ目がクリボウの考えたものです。適当な名前が思いつきませんでした。
この方式の「最近のコメント」欄は、個別ページへとリンクの張られたコメント投稿日時と、投稿者名とを書き出します。
このブログの、トップページおよびアーカイブページのサイドバーに貼り付けているので、ご確認下さい。
この方法の長所は、トップページに載らないページのコメントも反映できる点。短所は、RSS へのアクセスが発生する分、表示が遅くなる点です。以下、この方式の「最近のコメント」欄の導入方法について説明します。
1.Mail2RSS を開き、@Mail2RSS.org の前の文字をクリック、好きな名前をつけます。名前を確定させたとき Subject, From, Received 欄に何も表示されなければ、そのアカウントは未使用だということ。そのメールアドレスをメモ帳などに控えておきます。
2.Blogger 管理画面「設定 > コメント」よりコメント通知アドレスを1のアドレスに変更します。コメント通知メールの送信先を GMail にされている方は、GMail 側でフィルタリングして1のアドレスに転送する方法もアリです。
3.Blogger のテンプレートを編集します。Blogger 管理画面「テンプレート > 現在の内容を編集」からテンプレートの head 要素内(
<head>
と
<head>
との間)に次のコードを貼り付けます。
<script type="text/javascript">
<!--
function addRecentComments() {
var element = document.createElement("script");
element.setAttribute("src", "http://tools.kuribo.info/recentcomment/?user=あなたのMail2RSSアカウント");
element.setAttribute("charset", "UTF-8");
document.body.appendChild(element);
}
if (window.addEventListener) {
window.addEventListener("load", addRecentComments, false);
} else if (window.attachEvent) {
window.attachEvent("onload", addRecentComments);
} else {
window.onload = addRecentComments;
}
//-->
</script>
赤字の部分は、1のアドレスの @ 前の文字列に置き換えてください。
4.テンプレートの「最近のコメント」欄を表示したい部分(たいていサイドバーだと思います)に次のコードを貼り付けます。
<div id="recent-comments"></div>
この div 要素の中身は、コメントのフィードが取得でき次第、コメント情報に差し替えられます。なので div 要素内にはあらかじめ Loading... といった文字列や、ロード画像を入れておくのもおもしろいと思います。ロード中に表示させる画像を作成するには、
Ajaxload というツールがオススメです。
5.「設定を変更」ボタンをクリックし、ブログを「再構築」すれば、導入は終了です。表示されるのはこの機能の導入後に投稿されたコメントなので、あとはのんびりコメントを待ちましょう。
おわりに
以上、二つの方式の「最近のコメント」欄導入法でした。
今クリボウが考えているのは、メールからフィードを作成してくれるサービス、他にいいところがないかなあということ。Mail2RSS はフィードが出てくるのが遅い気がするのです。他のサービスをご存知でしたら教えてくださいませ。
「最近のコメント」欄、紹介されている以外にこんな方法も考えられるよ、という方も教えて下さい。その他「最近のコメント」欄導入の感想や意見などもぜひコメント下さいね。えーつまり、なんでもコメントしてもらえるとうれしいです、ということです。
追記
H & A さんからリクエストいただいていた、クリボウ式「最近のコメント」のカスタマイズについてです。
「2006-06-17 kuribo」と表示される内容に、任意の文字列を追加できるようにしました。例えば、導入手順3で示した赤字部分の URL に
&a=on&b=%20by%20&c=
というパラメータを追加すると「on 2006-06-17 by kuribo」と表示されるようになります。
a で日付の前、b で日付とコメント投稿者名の間、c でコメント投稿者名の後の文字列を指定することが可能です。
英数字はそのまま通りますが、日本語や記号は、UTF-8 で
URL エンコードしてください。
HTML タグを入れるのもアリなので色々なことが出来ると思うんですが、ダブルクォート(")だけ、使用できないのでご注意下さい(URL エンコードしても無理です)。