忍者ブログ

WEBデザインとかSOHO, MacユーザのWEB制作者の徒然メモ。

[PR]

Posted by - 2017.11.20,Mon
×

[PR]上記の広告は3ヶ月以上新規記事投稿のないブログに表示されています。新しい記事を書く事で広告が消えます。

Flickrの写真をjQueryで自動で取得して自サイトやブログに表示

Posted by toka - 2009.09.14,Mon
Flickrの自分のアカウントから、写真を自動で取得して、サイトに表示したかった時のメモ。

【準備するもの】
●FlickrのAPIキー
●表示させたい写真群のFlickr ID
※分からなければ、idGettrから取得可能

で、今回はjQuery Flickrというプラグインを使ってやってみました。

【jQuery Flickrの導入手順】
以下のページから、jquery.flickr-1.0.jsをダウンロード。

Project Atomic » Blog Archive » jQuery Flickr

で、<head>〜</head>内に以下のタグを記述。(jsファイル名とディレクトリは環境に合わせる)

<script language='javaScript' src='jquery-latest.pack.js' type="text/javascript"></script>
<script language='javaScript' src='jquery.flickr-1.0.js' type="text/javascript"></script>

<script type="text/javascript">
    jQuery(function(){  
        jQuery("#gallery-flickr").flickr({    
            api_key: " (FlickrのAPIキーをここに入れる) ",    
            per_page: 10
        });
    });
</script>

そしたら、jquery.flickr-1.0.jsに手を入れる。

13行目を「type: 'search'」に。
16行目は「user_id: '(FlickrのIDをここに入れる)'」という感じに設定。

それで、<body>以下の写真を表示させたい場所に下記のタグを挿入。

<div id="gallery-flickr"></div>

これでおしまい。
PR
Comments
Post a Comment
Name :
Title :
E-mail :
URL :
Comments :
お手数をおかけ致しますが、文中のどこかに「す。」という言葉を入れてコメントして頂きますようお願い致します。(例:〜です。)
※外国語圏からのスパム防止のため。
Pass :   Vodafone絵文字 i-mode絵文字 Ezweb絵文字
TrackBack URL
TrackBacks
人気っぽい記事7つ
あわせて読みたい
メールフォーム
Powered by NINJA TOOLS
Twitter
プロフィール
HN:
toka
性別:
非公開
職業:
WEB制作者
自己紹介:
フリーランスのWEBデザイナー。
マーケティングへの取り組みやユーザビリティの向上にも興味を持って活動しております。
にほんブログ村 デザインブログへ
カテゴリ一覧
忍者ブログ [PR]
Powered by "Samurai Factory"