Tumblrにアップした画像(photo)をサムネイル表示するスクリプトを近々リリースする予定です。


サムネイル表示自体は、Tumblrが提供しているAPIから生成することが出来ます。

Tumblr : boreal-kiss.com

しかしAPIの機能が限定的なため「直近の画像」しか表示できません。個人的にはタグで絞り込んだサムネイルや、投稿した時期を絞り込んだサムネイルも欲しかったので、そのようなものを作成してみました。
サンプルはこちら。


僕が2009年3月にアップした画像の中から新しいもの21点をピックアップしています。パラメーターはこんな感じになる予定。

  • user: ユーザー名(必須)
  • date: 日付(年YYYY、年月YYYY-MM、年月日YYYY-MM-DDに対応)
  • tag: タグ
  • num: 取得数。デフォルトは10、allで全取得

ちなみに…Tag Cloud Makerと同じように初めて使用したときは全ログを取得する(タグ解析のため)ので、ログが多いユーザの場合には表示に時間が掛かることがあります。2回目からの表示は素早く表示できると思います。




オマケ:Tumblrの直近の画像をサムネイルとして表示するスクリプト

Tumblr APIのJSONを利用すれば、直近の画像のサムネイルは簡単に取得できます。
例えばこんな感じ。



ソースコード

<script type="text/javascript" src="http://(ユーザー名).tumblr.com/api/read/json?type=photo&num=49"></script>
<script type="text/javascript">
document.write('<div id="thumnailsRecent"></div>');
var ul = document.createElement('ul');
var posts = tumblr_api_read['posts'];
for (var i in posts) {
  var li = document.createElement('li');
  var a = document.createElement('a');
  a.setAttribute('href', posts[i]['photo-url-500']);
  a.setAttribute('target', '_blank');
  a.setAttribute('rel', 'lightbox');
  var img = document.createElement('img');
  img.setAttribute('src', posts[i]['photo-url-75']);
  a.appendChild(img);
  li.appendChild(a);
  ul.appendChild(li);
}
document.getElementById('thumnailsRecent').appendChild(ul);
var clear = document.createElement('div');
clear.style.clear = 'both'
document.getElementById('thumnailsRecent').appendChild(clear);
</script>