1. 2009年06月
  2. ≪
  3. 1
  4. 2
  5. 3
  6. 4
  7. 5
  8. 6
  9. 7
  10. 8
  11. 9
  12. 10
  13. 11
  14. 12
  15. 13
  16. 14
  17. 15
  18. 16
  19. 17
  20. 18
  21. 19
  22. 20
  23. 21
  24. 22
  25. 23
  26. 24
  27. 25
  28. 26
  29. 27
  30. 28
  31. 29
  32. 30
  33. 31
  34. ≫
  35. 2009年08月
  1. WebとPCのメモ帳
  2. スポンサー広告
  3. JavaScriptを使いdel.icio.usの被ブックマーク数を表示する
  1. WebとPCのメモ帳
  2. Web・Blog
  3. ブログカスタマイズ
  4. JavaScriptを使いdel.icio.usの被ブックマーク数を表示する

Ads by Google

--
--/--(--)
Category
Tags
  • No Tag
上記の広告は１ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。
拍手する はてなスター
関連エントリ
ソーシャルブックマーク登録数
  • hatena
  • livedoor
  • Buzzurl
  • Yahoo!
  • FC2
  • Delicious

JavaScriptを使いdel.icio.usの被ブックマーク数を表示する

2008
02/04(Mon)
Category
Tags
FC2BlogでFC2ブックマークの登録人数を表示するというエントリを前に書きましたが、今度はdel.icio.usの被ブックマーク数をFC2Blogで表示する方法です。
基本的に海外の利用者数が多いSBMサービスですが、意外とブックマークされていることもあるので興味がある方は使ってみてはいかがでしょうか。

普通は各SBMサービスで登録人数表示用のAPIが用意されているのですが、del.icio.usは手軽に使える公式APIがないのでFC2Blogの変数とJavaScriptを利用します。
(この表示方法自体も非公式もの。)
ここで使うのはFC2Blogの変数ですが、同じような変数が使えるBlogサービスなら変数の入れ換えだけで流用できるかもしれません。
なお変換自体にJavaScriptを使うため、JavaScriptがOFFのブラウザ環境では表示させることはできません。

del.icio.usはひと味違う

はてなブックマークを始め、普通のSBMサービスは被ブックマーク数を比較的簡単に取得できるようになっています。
FC2ブックマークは公式サイトに何も書いてないというありさまですが、それでもそのまま数を取得できるようにはなっています。
そして今回のdel.icio.usなのですが、これは少々面倒なことになっています。

楽：技林ブログ
ソーシャル・ブックマーク・サービスの被ブックマーク数取得まとめ

非公式インターフェース。。。
URLをMD5ハッシュに変換する(JavaScript=MD5.js, Perl=Digest::MD5, PHP=md5関数)必要がある。

書式：http://del.icio.us/feeds/img/savedcount/[URLのMD5ハッシュ]?aggregate


要するにそのままだと取得できなくて、URLをMD5に変換してやらないと駄目なのです。
実際にdel.icio.usのブックマーク数を取得して表示してるところも多数あるのですが、大概はMovable TypeやWordPressのプラグインやCGIを使って表示しているようです。
貼り付けるだけで表示できるようなものも探したのですが、残念ながら見つかりません。
ということで、JavaScriptでURLをMD5ハッシュに変換し、Blogにdel.icio.usの登録人数を表示するスクリプトを組んでみました。
(正確にはURLをmd5.jsに渡しているだけ。)
FC2Blogでは正常に動作することを確認しています。
(ただし私はプログラムについては超素人で、JavaScriptでは昔マウスオーバーすると画像が変わるスクリプトぐらいしか組んだことがありません。失笑レベルなスクリプトなのはご勘弁を。)

FC2Blogでdel.icio.usの被ブックマーク数を表示する

具体的な手順です。

1.md5.jsをダウンロードしてFC2Blogにアップロードする

高度な JavaScript 技集からmd5.jsをダウンロードし、自分のBlogにアップロードしてください。

2.スクリプトを読み込むタグをテンプレートに書き込む

以下のソースを<head></head>の間に書き込んでください。

<script type="text/javascript" src="アップロードしたURL/md5.js"></script>

3.ブックマーク数を表示したいところにスクリプトを貼り付ける

del.icio.usの被ブックマーク数を表示したいところに、以下のソースを書き込んでください。

<script type="text/javascript">
<!--
var en_url = '<%topentry_link>';
md5_url = MD5_hexhash(en_url);
document.write('<a href="http://del.icio.us/url/'+md5_url+'" title="このエントリを含むdel.icio.us"><img src="http://images.del.icio.us/static/img/delicious.gif" style="border:0;" alt="このエントリを含むdel.icio.us" /><\/a>');
document.write('<img src="http://del.icio.us/feeds/img/savedcount/'+md5_url+'?aggregate" style="border:0;" alt="del.icio.us saved count" />');
// -->
</script>

成功すれば下記のように表示されているはずです。



余談ですが、MD5ハッシュをブラウザのJavaScriptで計算する関係上、旧型のPC環境などだと重くなる可能性はあります。
また、動作チェックした環境はWindows XPでのIE6、Firefox2、Opera9.25です。
その他のOSやブラウザ環境できちんと表示されるかはわかりませんので注意してください。

おまけ 他のBlogで代用できるかもしれない変数

上記のソースの緑文字の変数と同じ動作をする、いくつかのBlogサービスの変数をピックアップしてみました。
そのまま置き換えることによって動く「かも」しれません。
当方ではチェックのしようがないので、やるなら自己責任でお願いします。

Seesaaブログ : <% article.page_url %>
Blogger : <$BlogItemPermalinkUrl$>
livedoor Blog : <$ArticlePermalink$>
忍者ブログ : <!--$entry_link-->

参考URL
ブックマークアイコンの取り付け
独自構文解説書／変数
拍手する はてなスター
関連エントリ
ソーシャルブックマーク登録数
  • hatena
  • livedoor
  • Buzzurl
  • Yahoo!
  • FC2
  • Delicious

コメント

Comment Form
このエントリへコメントを書く
(任意)
(任意) 公開されません
(任意)
(必須) HTMLタグは使用できません
(任意) ID生成に使用します
(任意) チェックを付けた場合はコメント欄に何も表示されません。また、返答も基本的におこないません。

トラックバック

Trackback URI
http://128bit.blog41.fc2.com/tb.php/52-a1da3c0d この記事にトラックバックする(FC2ブログユーザーのみ)

スパム対策のため言及リンクのないトラックバックは反映されません

Deliciousの被ブックマーク数を表示する方法

アクセス解析の検索ワードをチェックしていたら「Deliciousの被ブックマーク数を取得する方法」を探している人が意外と多いようなので、このBlog...

WebとPCのメモ帳

  • from WebとPCのメモ帳 |
  • 2008 10/28 (Tue) 23:48 はてブ数

Page Top

ブログパーツ