2014.7.6追記
久しぶりの追記です…。
久方ぶりに!?当サイトを見てみたら、Flickr画像が取得できていない状態になっていました。また、数件お問い合わせで｢紹介されているスクリプトを使ってもFlickr画像が取得できないよー｣というお問い合わせも届いていましたので、一部ソースを変更。
原因はFlickr側の一部APIの仕様変更です。
変更箇所は大きく分けて以下の2つです。
1.｢http｣→｢https｣に変更
2.｢static.flickr.com｣→｢staticflickr.com｣
他にもFlickrのThe App Gardenを見る限り、”farm-id”や”server-id”に変わっていますが、そこは変更しなくても取得できているようです。
当サイトのサイドメニューに表示されているFlickr、こちらのページのDEMOページも合わせて変更しました。
当サイトの記事をご覧いただいている方は、ご参考まで。

以下の手順で紹介していきます。
※テキストリンクをクリックすると、その箇所までページがスクロールします。

1. FlickrのAPIキーを取得する
2. Flickr APIで画像情報を取得するPHPスクリプトを作成する
   ・”検索ワード”または”ユーザーID”から画像情報を取得
   ・cURLとsimplexml_load_stringを使ってXMLを取得
   ・Lightboxと連携したFlickr画像の表示
   ・Flickr画像のライセンス規約
   　等の内容で紹介
3. デモページで動作確認をする

●確認事項
Flickrの利用･ライセンスに関しては、Flickrの規約を必ずご確認ください。
Flickr APIを利用する際は、利用規約に同意した上でご利用ください。
当記事を参考にして発生した不具合･損害等に当サイトは一切責任を負いません。
自己責任でのご対応を宜しくお願いします。
※ちょっと大げさかもしれませんが、Flickrの著作権問題もありますので一応…。

[参考リンク]
・Flickr
・Flickrのコミュニティガイドライン
・Flickr APIドキュメント
・クリエイティブ・コモンズ・ライセンスとは

FlickrのAPIキーを取得する

まず、以下にアクセスして、FlickrのAPIキーを取得します。
⇒ The App Garden on Flickr
※FlickrのIDは取得しておいてください。
※FlickrのID取得には、米国版のYahoo!IDを取得する必要があります。
※予めFlickrにサインインしておいてください。

1.”Get your API Key”の”Request an API Key”をクリック

※画像をクリックすると拡大表示された画像のみを順番に見ることができます

2.非商用利用の”APPLY FOR A NON-COMMERCIAL KEY”をクリック

3.”What’s the name of your app?”と”What are you building?”を入力

“アプリケーション名”と”どんなアプリケーションを作っているのか”は、後でも編集可能。

4.APIキーが表示される

APIキーが表示されますので、控えておきましょう(※Flickrにサインインすれば見れます)。
ちなみに”sample”と表示されているのがアプリケーション名です。

Flickr APIで画像情報を取得するPHPスクリプトを作成する

Flickr APIで画像情報を取得するスクリプトは以下のようになります。
それでは、順番に説明していきます。

flickr.php

<?php

// Flickr APIKEY
define (APIKEY, "APIキー");

// 検索ワード
$searchWord = "検索ワード";

// サムネイルサイズ(s.t.m.z.bよりサイズを設定)
$pictureSize = "サムネイルサイズ";

// XMLデータ取得用のベースURL
$url = "https://www.flickr.com/services/rest/?"
     . "method=flickr.photos.search"
     . "&format=rest"
     . "&api_key=".APIKEY
     . "&per_page=20"
     . "&license=1,2,3,4,5,6"
     . "&extras=owner_name"
     . "&text=".urlencode($searchWord);

// file_get_contentsの代わりにcURLを使用
// 初期化
$session = curl_init();
// アクセスするURL
curl_setopt($session, CURLOPT_URL, $url);
// ヘッダ文字列の出力
curl_setopt($session, CURLOPT_HEADER, false);
// curl_execの返り値を文字列にする
curl_setopt($session, CURLOPT_RETURNTRANSFER, true);
// 実行
$url = curl_exec($session);
// 終了
curl_close($session);

// XML文字列をパースしオブジェクトを取得
$xml = simplexml_load_string($url)
 or die("XMLパースエラー");

// ループ処理
$iLoop = 0;
echo "<table>";
foreach($xml->photos->photo as $photoValue){
    if( $iLoop == 0){
            echo "<tr><td>";
    } else {
            echo "<td>";
    }
    $farmId = $photoValue['farm'];
    $serverId = $photoValue['server'];
    $owner = $photoValue['owner'];
    $ownername = $photoValue['ownername'];
    $photoId = $photoValue['id'];
    $secret = $photoValue['secret'];
    $title = $photoValue['title'];
    $url = "https://farm".$farmId.".staticflickr.com/".$serverId."/".$photoId."_".$secret.".jpg";
    // Lightboxで表示(jQuery版)
    echo "<a href=\"".$url."\" title=\"Photo：&lt;a target=&quot;_blank&quot; href=&quot;https://www.flickr.com/photos/".$owner."/".$photoId."&quot;&gt;".$title." By ".$ownername."&lt;/a&gt;&lt;br /&gt;Powered By Flickr Service&lt;br /&gt;※テキストリンクよりFlickrの元ページへ移動します。\" class=\"lightbox\"><img src=\"https://farm{$farmId}.staticflickr.com/{$serverId}/{$photoId}_{$secret}_{$pictureSize}.jpg\" alt=\"Photo：".$title." By ".$ownername."\"></a>";
    $iLoop++;
    // 画像の列数を指定
    if( $iLoop == 4){
            echo "</td></tr>";
            $iLoop = 0;
    } else {
            echo "</td>";
    }
}
if( $iLoop != 0 ){
        echo "</tr>";
}
echo "</table>\n";

?>

説明

●Flickr APIKEY
APIKEYに｢FlickrのAPIキーを取得する｣で取得したAPIキーを指定します(4行目)。

●検索ワード
$searchWordにFlickrから取得したい画像の検索ワードを指定します(7行目)。
例えば”犬”と指定すると、Flickrのサーバーから”犬”といった検索ワードに合致した画像を取得します(※デフォルト設定では”アップロード日時の新しい順”に取得します)。

[ユーザーIDから画像情報を取得するには？]
▼変更箇所1
$searchWord = “検索ワード”;(7行目)
↓
$userId = “ユーザーID”;
▼変更箇所2
. “&text=”.urlencode($searchWord);(20行目)
↓
. “&user_id=”.urlencode($userId);

●サムネイルサイズ(s.t.m.z.bよりサイズを設定)
$pictureSizeに取得する画像のサムネイルサイズを指定します(10行目)。

[Flickrのサムネイルサイズ]
・s･･･中心部分をトリミングした75px×75px
・t･･･縦横で長い方を100pxにリサイズ
・m･･･縦横で長い方を500pxにリサイズ
・z･･･縦横で長い方を640pxにリサイズ
・b･･･縦横で長い方を1024pxにリサイズ

●XMLデータ取得用のベースURL
$urlに”https://www.flickr.com/services/rest/?”を指定します(13行目)。
methodに実行メソッド名”flickr.photos.search”を指定します(14行目)。
formatに出力フォーマット”rest(XML形式)”や”json(JSON･JSONP形式)”を指定します(15行目、ここでは”rest”を指定します)。
per_pageに検索1回あたりの取得件数を指定します(17行目)。

[ライセンス規約に関して]
licenseにFlickr画像のライセンスの種類を指定します(18行目)。
ライセンスには、”無断複写･転載禁止”と”クリエイティブ・コモンズライセンス”があり、ライセンスIDは無断複写･転載禁止が”0″、クリエイティブ・コモンズライセンスが”1～6″となります。上記では、”1～6″を指定していますので、無断複写･転載禁止の画像は読み込まず、クリエイティブ・コモンズライセンスの画像のみを読み込みます。

詳しくは、以下Flickr Creative Commonsページをご確認ください。
⇒ Flickr Creative Commons

●file_get_contentsの代わりにcURLを使用
“file_get_contents”の代わりに”cURL” を使用します。
curl_init()で初期化します(24行目)。
curl_setopt()でオプションを設定します(26～30行目)。
CURLOPT_URLでアクセスするURLを設定し($url)、CURLOPT_HEADERでヘッダ文字列を出力しないようにします(false)。そして、CURLOPT_RETURNTRANSFERでcurl_execの返り値を文字列にします(true)。
curl_exec()で実行します(32行目)。
curl_close()で終了します(34行目)。
[参考リンク：cURL 関数]

●XML文字列をパースしオブジェクトを取得
“simplexml_load_file”の代わりに”simplexml_load_string”を使います(37行目)。
また、php.iniで”allow_url_fopen”をOffにしてください。

●ループ処理
echo文の箇所は、デザインに合わせて変更してください。
上記の例では、tableタグを使って画像の列と行を分けるようにしています。
画像の間に隙間が出来てしまう場合、以下をお試しください。

[CSSを追記]
tableタグにCSSのクラスを追加(※table class=”space”～)。
table.space {
           border-collapse: collapse;
}
table.space tr td {
           padding: 0px;
}
img要素に”vertical-align: bottom;”を適応(※“border: 0px;”で画像にボーダーが表示されないようにし、画像間の隙間はマージンで調整してください)。

●画像の列数を指定
“$iLoop == 4″で表示される画像の列数を指定します(61行目)。

Lightboxと連携したFlickr画像の表示

次に、Flickrの画像を表示する際、Lightboxで画像を表示するようにします。
“Lightboxで画像を表示”ということは、画像そのものにFlickrへのリンクを設定出来なくなりますので、クレジット(著作者表示)を考慮しなければいけません。
Flickrのクリエイティブ・コモンズライセンスの画像には、以下のクレジット(著作者表示)が必要です。
・作品名(画像のタイトル)
・作者(所有者)
・配布元(Flickr)へのリンク

上記を考慮して、Lightboxのキャプションに｢作品名(画像のタイトル)｣｢作者(所有者)｣｢配布元(Flickr)へのリンク｣が表示されるようにします。
また、”Flickrを使用しているという記載(Powered By Flickr Service等)”や”配布元(Flickr)へリンクしていることの説明”も表示させます。

[2012.4.7追記]
Lightboxのキャプション表示を変更

Lightboxのキャプションには、画像をLightboxで表示させた際、title属性に指定したテキストを表示させることができます。
ですが、ここで｢うーん…｣と思うことが一つあります。それは、title属性に指定したテキストは、Lightboxのサムネイル画像にもツールチップとして使われることです。キャプションが長い場合、あまり見た目がよいとは言えません。
そこで、以下の修正をすることで、title属性とキャプションを分ける事ができます。

1.jquery.lightbox-0.5.jsを変更
・80行目辺りに出てくる以下を変更
settings.imageArray.push(new Array(objClicked.getAttribute(‘href’),objClicked.getAttribute(‘title’)));
↓
settings.imageArray.push(new Array(objClicked.getAttribute(‘href’),objClicked.getAttribute(‘caption’)));
※“title”を”caption”に変更
・85行目辺り(上記の直ぐ下)に出てくる以下を変更
settings.imageArray.push(new Array(jQueryMatchedObj[i].getAttribute(‘href’),jQueryMatchedObj[i].getAttribute(‘title’)));
↓
settings.imageArray.push(new Array(jQueryMatchedObj[i].getAttribute(‘href’),jQueryMatchedObj[i].getAttribute(‘caption’)));
※“title”を”caption”に変更

2.flickr.phpを変更
・flickr.phpの58行目のecho文の箇所を一部変更
“title=~”を”caption=~”に変更
※“title”の文字を”caption”に変更するだけです
title=\””.$title.”\”を追記
※上記”caption=~”の後ろにでも追記してください
※半角で手入力してください(コピー&ペースト時には注意)
※ツールチップに画像のタイトルだけが表示されます

当記事のデモページ(Demo Pageボタンをクリックすると開くページ)の方だけ上記を反映してみました。サムネイル画像のツールチップに画像タイトルだけ表示されます。
｢Lightbox使用時、サムネイル画像のツールチップに長いキャプションが表示されるのが気になる…｣といった方は一度試してみてください。

また、caption属性はグローバル属性ではありませんので、バリデータチェックではエラー対象になると思います(※title属性はグローバル属性のためバリデータチェックでエラーになりません)。要するに｢caption属性は本来a要素で使用するための属性ではないですよ｣ということです。クライアントさんから｢この長すぎるツールチップ何とかしてよー｣とか言われた場合なんかに使える方法だと思います。

Flickrのクレジット(著作者表示)に関しましては、nanapiさんのサイトを参考にさせていただきました。

LightboxにはjQuery版を使用します。
以下のLightboxプラグインが簡単でしたのでそちらを使用しました。
⇒ jQuery lightBox plugin
※jquery.lightbox-0.5.css、jquery.js、jquery.lightbox-0.5.js、imagesを使用。
[2014.3.1追記]
現在、jQuery lightBox pluginのダウンロードページはなくなっているようです。

ヘッダーに以下を追記。

flickr.php

<head>
<link rel="stylesheet" href="css/jquery.lightbox-0.5.css" type="text/css" />
<script src="js/jquery.js" type="text/javascript"></script>
<script src="js/jquery.lightbox-0.5.js" type="text/javascript"></script>
<script type="text/javascript">
$(function(){
$('a[href$=".jpg"], a[href$=".gif"], a[href$=".png"]') 
  .addClass("lightbox");
$('#content a.lightbox').lightBox();
});
</script>
</head>

説明

7行目は”a[href$=”.jpg”]”のみでも構いません(※APIで画像情報を取得するスクリプトの56行目の”$url”と58行目のecho文の箇所で拡張子をjpgのみにしているためです。他ページでもLightboxを使い回したい場合、6～10行目を外部ファイル化して、gifとpngをそのままにしてください)。
“#content”はCSSのidに合わせて変更してください(9行目)。

次は、flickr.phpのLightboxでFlickr画像を表示させる部分の説明です。
上記のPHPスクリプトサンプルの49～58行目の箇所です。
かなり記事が長くなってしまいましたので、この箇所だけ下記に追記し説明します。

flickr.phpの49～58行目

$farmId = $photoValue['farm'];
$serverId = $photoValue['server'];
$owner = $photoValue['owner'];
$ownername = $photoValue['ownername'];
$photoId = $photoValue['id'];
$secret = $photoValue['secret'];
$title = $photoValue['title'];
$url = "https://farm".$farmId.".staticflickr.com/".$serverId."/".$photoId."_".$secret.".jpg";
// Lightboxで表示(jQuery版)
echo "<a href=\"".$url."\" title=\"Photo：&lt;a target=&quot;_blank&quot; href=&quot;https://www.flickr.com/photos/".$owner."/".$photoId."&quot;&gt;".$title." By ".$ownername."&lt;/a&gt;&lt;br /&gt;Powered By Flickr Service&lt;br /&gt;※テキストリンクよりFlickrの元ページへ移動します。\" class=\"lightbox\"><img src=\"https://farm{$farmId}.staticflickr.com/{$serverId}/{$photoId}_{$secret}_{$pictureSize}.jpg\" alt=\"Photo：".$title." By ".$ownername."\"></a>";

説明

49～55行目は、Flickrの画像URLに用いられる値です。
$urlがFlickrの画像URLになります(56行目、以下のようになります)。
https://farm{farmId}.staticflickr.com/{serverId}/{photoId}_{secret}.jpg
また、サムネイル画像をクリックした時に表示される画像サイズも設定可能です。
$urlの末尾に”_s.t.m.z.b(s～bのどれか)”を追記します(56行目)。
指定しなかった場合、縦横で長い方を500pxにリサイズして表示します。
例) ～”.$secret.”_m.jpg

58行目のaタグ部分がLightboxで表示される際の指定、imgタグ部分がサムネイルの表示指定になります。

▼Lightbox表示イメージ

デモページで動作確認をする

最後にデモページを用意しました。
下記の”Demo Page”ボタンをクリックすると“検索ワードで指定したFlickr画像”が表示されます(※検索ワードは”ワンピース”にしました。服なんかのワンピースも出てますが…)。

下記の”Demo Page”ボタンをクリックすると“ユーザーIDで指定したFlickr画像”が表示されます(※私のユーザーIDでFlickr画像を読み込みました)。
※ユーザーIDを調べるにはidGettrが便利です！