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>