blog

フリーランスのWeb制作 : デザイン、HTML/CSSコーディング、CMS
EPXスタジオ www.epxstudio.com

deliciousの最近のブックマークを表示する

Web2008-12-26 21:20

旧ブログの時から右カラムに表示している「最近のブックマーク」ですが、リニューアルにあたって、せっかくなので実装の方法を再検討してみました。その簡単な覚え書きです。

delicious公式のLinkrollsを利用する
これが一番ラク。Linkrollsを使えば、表示したい項目を選んでいくとAjax的にコピペ用のコードが生成されるので、ブックマーク一覧を表示したい箇所にペーストするだけです。
ただし、これだと生成されるHTMLが個人的に微妙なのと(ブックマーク時にコメントを必ず入力しているので、TITLEとNOTESを対にした定義リストでマークアップしたい)、今のレイアウト中で使うと、ページ全体を描画する前にスクリプトが実行されるため、一瞬だけ表示が崩れてしまうことの2点から、見送ることにしました。
MTプラグイン、deliciousJSONを利用する
これは全然知らなかった!deliciousブックマーク情報を出力するためにMTタグを拡張する、deliciousJSONというプラグインがありました。これ、使用例に出ているマークアップも含めてかなりいい感じだったんだけど、テンプレートに埋め込むと、ココ以外の全ての箇所が何故か文字化けしてしまうという症状が…。
一応、PHPインクルードで解決するという報告を見つけたものの、MTのPHP化はもう少しメリット・デメリットを洗い出してから検討したいので、とりあえず今回は無しです。
JSONフィードを利用する
結局、以前と同じ方法を引き続き採用することにしました。http://feeds.delicious.com/v1/json/ユーザー名で提供されているJSONフィードから配列を取り出して、DOM操作で要素を生成します。スクリプトを最後の方に書けば、描画が乱れることもないと思います。詳細はソースを参照してください。
ちなみに、ひとつ前の記事の最後で触れた「IE6で表示されない問題」は、JSONフィードの参照先を古いURIから上記に修正したところ解決しました。よかった。
Share on Tumblr このエントリーをはてなブックマークに追加