びるのブログ回転するUFO

HN「びる」の雑記 サブブログです。 メインブログは、http://funnypainter.wordpress.com/ です。
・ びるのブログ 各カテゴリー最新5記事 一覧                        ・ 全ての記事を表示する(サイトマップ)
Top Page > Web > Tumblr API を使って、Photoのサムネイルを表示

Tumblr API を使って、Photoのサムネイルを表示

このエントリーをはてなブックマークに追加
前に、「Twitpic API を使って、投稿写真を左カラムの一番下に表示してみた。」という記事を書きました。

今回は、Tumblr API を使って、Photoのサムネイルを表示させたいと思います。
参考にした記事はこちらです。
  • Tumblr API – JSON 形式で Javascript で読み込み表示する | gutarin


  • 参考ページの後半にある
    [version:photo]Tumblr ポストから最新の photo のサムネイル(75サイズ)を五件縦に並べて表示。
    よりソースをコピーします。 一行目の赤文字の部分を 「自分のTubmlr ID」 に変更します。

    <script type=”text/javascript” src=”http://you.tumblr.com/api/read/json?num=5&type=photo”
    ></script>
    <script type=”text/javascript” >
    // 表示設定部分 ———————————————-
    //
    以下省略

    簡単に、サムネイルが取得できます。

    このブログでもよかったのですが、余計ゴチャつきそうだったので、自分のTumblrのページにソースを貼って表示してみました。 赤丸で囲まれた部分がサムネイルを表示した部分です。

    Tumblr スクリーンショット

    Tumblr スクリーンショット


    しかし、Tumblr ってテーマを編集できるのはいいのですが、オンラインエディタが、言うことを聞かなくてちょっと難儀しました^^。
    右側のカラムの一番最後に、コードを追加しました。 テーマの最後の方に<div>でコードで挟んで表示させています。
    興味のある方は、ページのソースを表示してみるとわかると思います。

    実は、その上にあるタグクラウドも同様の方法でコードを貼って表示させました。 Tumblrのサードパーティーアプリケーションからコードが入手できます。

    Tumblrって、出来合いのテーマで楽しむイメージですが、やりようによってはカスタマイズも可能です。
    興味のある方は、いじってみてはいかがでしょう?
    関連記事
    スポンサーサイト
    [ 2012/04/21 19:11 ] Web | TB(0) | CM(0)
    コメントの投稿












    管理者にだけ表示を許可する
    トラックバック
    この記事のトラックバックURL

    アクセスカウンター
          

    現在の閲覧者数 :       
    プロフィール

    びる

    Author:びる
    こんにちは、funnypainterこと、HN『びる』と申します。最近は、TogetterのまとめやWordPress等CMSに興味あり。

    ★びるのプロフィール★

    ソーシャルブックマーク
    Yahoo!ブックマーク Googleブックマーク はてなブックマーク livedoorClip del.icio.us newsing FC2 
    Technorati ニフティクリップ iza Choix Flog Buzzurl 
    最近の記事+コメント
    全記事表示リンク (サイトマップ)
    ブロとも申請フォーム
    アルバム
    てをつなごう だいさくせん
    Powered By FC2ブログ

    今すぐブログを作ろう!

    Powered By FC2ブログ