エントリと関連するdel.icio.usのブックマークを表示する

Tag:
,
-
Laika @ 2007年01月16日 15:44
|
Permalink

空いた時間にカスタマイズしているわけですが、やりたかったことその1、「エントリーページに関連リンクをつける」。具体的には、まずそのエントリーについているタグと同じタグが設定されているエントリーを一覧する。さらに、もうひとつ、そのタグが設定されている自分のdel.icio.usのブックマークを一覧する。これをやりたかったのです。(タグクラウドはどうした!?・・・ちょっと後回しにw)

参考にしたサイトは、

自分の場合はサイドバー部分に関連エントリと関連ブックマークを一覧表示させます。

上記del.icio.usのhelpを見て、下記部分は自分のサイトに合わせて挿入。div要素のid部分は変更しないでそのまま使用、USERNAMEは自分のdel.icio.usのIDに変更します。

<div class="section" id="related-bm">
  <h2>related bookmarks</h2>
  <script type="text/javascript" src="http://del.icio.us/feeds/json/USERNAME/<MTEntryTags glue="+"><$MTTagName$></MTEntryTags>?count=5"></script>
  <script type="text/javascript" src="<$MTBlogURL$>js/related-bm.js"></script>
</div>

加えてJavascript部分ですが、

<script type="text/javascript" src="http://del.icio.us/feeds/json/tags/USERNAME?count=20&sort=count"></script>
は、次の様に書き換えます。
<script type="text/javascript" src="http://del.icio.us/feeds/json/USERNAME/<MTEntryTags glue="+"><$MTTagName$></MTEntryTags>?count=5"></script>

countの部分は表示したい件数を入れればOK。

最後に、以下を入れるのですが、自分は外部jsファイルにして読み込むようにしました。スクリプト要素でコンテナしてもかまわないです。

var ul = document.createElement('ul');
for (var i=0, post; post = Delicious.posts[i]; i++) {
  var li = document.createElement('li');
  var a = document.createElement('a');
  a.setAttribute('href', post.u);
  a.setAttribute('title', post.d);
  a.appendChild(document.createTextNode(post.d));
  ul.appendChild(li);
  li.appendChild(a);
} 
document.getElementById('related-bm').appendChild(ul);

とかまとめつつ、自分も今やっている途中なので、このエントリでテストです。このエントリにはTaggingとJSONをタグとして設定します。きちんとできていれば関連ブックマークに同じタグがついているブックマークがでてくるはずです。