はてなブックマークやdel.icio.usなどのソーシャルブックマークは、個人用ブックマークツールとしても十分な機能を持っています。自分のブックマークをパブリックにすることは自分の今の興味事項や趣味趣向を公開することと同じですから、これを自己紹介の一つの切り口として考えると面白いかもしれません。
これらソーシャルブックマークのマイページにリンクを張ってしまうのが簡単ですが、自サイトとデザインや構成を統一した上で他ページと同列のコンテンツとして扱えるようにしてみました。このエントリでは、ソーシャルブックマークサービスが生成する RSS を
ぐぐるかるを使ってブログパーツ的に使う方法を紹介しています。
ここでも活躍ぐぐるかる! …だけれど Google と関係なくなってきたような?/p>
はてなブックマークや del.icio.us では、特定ユーザの公開されたブックマークを RSS として取得することができます。
ぐぐるかるを使ってこれら RSS に XSL 変換を行ない、所望の (X)HTML を生成します。XSL テンプレートを作る部分が少し敷居が高いかも知れませんが、一覧を表示する程度であれば出来合いの XSL のコピー&ペーストで済みそうです。
トップページの右サイドバーからリンクされた最新のブックマークページがそれになります。ページにはぐぐるかる のプロキシ CGI を呼び出す以下のような小さな JavaScript コードがあるだけです。
<div id="gglcal1_content"></div> <div id="gglcal1_loading"> <img src="/icons/loading.gif" alt="loading" align="top"/> Now Loading ... </div> <script type="text/javascript" src="/cgi-bin/mt/plugins/gglcal/jslb_ajax050_c.js"></script> <script type="text/javascript"> function gglcal1_doRequest (mode, next, self) { var param = ''; if (mode) param += '&mode=' + mode; if (next) param += '&next=' + next; if (self) param += '&self=' + self; sendRequest (onLoaded, param, 'POST', '/cgi-bin/mt/plugins/gglcal/gglcal-proxy.cgi', true); function onLoaded (oj) { document.getElementById ('gglcal1_content').innerHTML = oj.responseText; document.getElementById ('gglcal1_loading').style.display = 'none'; } } gglcal1_doRequest ('delicious'); </script>
またブックマークの RSS の URL を ./cache/00000000.xmlに指定し、変換ルールである XSL は次のようなテンプレートを記述しています。
<?xml version="1.0" encoding="utf-8"?> <xsl:stylesheet version="1.0" xmlns:rss="http://purl.org/rss/1.0/" xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:admin="http://webns.net/mvcb/" xmlns:gglcalfunc="http://www.magicvox.net/pub/xmlns/gglcal" > <xsl:output method="html"/> <!-- Root Document --> <xsl:template match="/"> <xsl:apply-templates select="rdf:RDF"/> </xsl:template><!--/--> <!-- rdf:RDF --> <xsl:template match="rdf:RDF"> <div class="divEntry"> <h1>最近のブックマーク</h1> <xsl:apply-templates select="rss:item"> <xsl:sort select="rss:item/dc:date"/> </xsl:apply-templates> </div><!--divEntry--> <div class="divEntryMore"> <img src="/icons/bltR0.gif" alt=">"/> <span class="spanEntryTitle"><a class="external" href="http://del.icio.us/pirolix">全てのブックマーク ...</a></span> </div><!--divEntryMore--> </xsl:template><!--rdf:RDF--> <xsl:template match="rss:item"> <xsl:if test="position () <= 30"> <div class="divItems"> <img src="/icons/bltR0.gif" alt=">" /> <a class="spanEntryTitle" href="{rss:link}" rel="nofollow"><xsl:value-of select="rss:title"/></a> <ul class="header"> <li> at <span class="date"> <xsl:value-of select="substring (dc:date, 1, 4)"/> <xsl:text>/</xsl:text> <xsl:value-of select="substring (dc:date, 6, 2)"/> <xsl:text>/</xsl:text> <xsl:value-of select="substring (dc:date, 9, 2)"/> <xsl:text> </xsl:text> <xsl:value-of select="substring (dc:date, 12, 5)"/> </span> </li> <xsl:if test="dc:subject"> <li> <img src="/icons/tag.gif" alt="タグ" /> <xsl:value-of select="dc:subject"/> </li> </xsl:if> </ul><!--header--> <xsl:if test="rss:description"> <blockquote style="margin-top: 1px; padding: 1px;"> <xsl:value-of select="rss:description"/> </blockquote> </xsl:if> </div><!--divItems--> </xsl:if> </xsl:template><!--rss:item--> </xsl:stylesheet>
これを設置してから、ページをクリップする際にできるだけ notes を書くよう心がけるようになりました。ビジタの便利を考えてのことですが、自分が後から見直す際にも有益なことに気が付きました。そんなわけでクリップするのが微妙に楽しい今日この頃です。
また、今のところ一つの RSS を整形して表示しているだけですが、複数のメタデータを横断的に組み合わせることで、何か面白い見せ方ができるんじゃないかなぁとか考えています。最近は様々なメタデータを RSS などで配信するサービスが増えてきましたから、今後はこういったデータを如何に組み合わせて新しい価値を創造するか、という部分にアイディアのタネを移していきたいところです。