flickrの動作テスト用
だいぶ仕上がってました。
ちょっと前に作ったので思い出しながら以下参考まで＆備忘録。
[flimg num=72157653394157722]
ショートコード本体は下記のように入力しています。
[[flimg num=72157653394157722]]
7215....の部分は自分のflickrのアルバムのURL後半のIDです。
functions.php側でhtmlへの書き出しをベタにやってます。
スライドショーも実装しているためソースはちょっとごちゃっとしてますがやってることはこんなところです。
- flickrのAPIkeyを登録
- APIからの読み方（jsonフォーマット）を設定
- jsonを文字列に格納
- htmlに吐き出すソースを記載（jsonの内容も一緒に）
- ショートコードを設定
function flimg_Func($atts) {
extract(shortcode_atts(array(
'num' => 0,
), $atts));
$photosetid = $num;
$apiKey = 'xxxxxxxxxxx';
$url = 'https://api.flickr.com/services/rest/?method=flickr.photosets.getPhotos&api_key=' . $apiKey . '&photoset_id=' . $photosetid . '&user_id=xxxxxxxx@N04&format=json&nojsoncallback=1';
$callback = 'callbak' . mt_rand(0,99999);
$boxnum = 'box' . mt_rand(0,99);
$json = $callback . '(' . file_get_contents($url) .')';//ファイルの内容を全て文字列に読み込む
$html = '<div class="flimg fotorama '. $boxnum . '" data-nav="thumbs" data-width="100%" data-thumbwidth="100" data-allowfullscreen="native" data-transition="dissolve" data-loop="true"></div>';
$html = $html . '<script type="text/javascript">';
$html = $html . 'function ' . $callback . '(data){$.each(data.photoset.photo, function(i,photo){';
$html = $html . 'var img_src = "http://farm" + photo.farm + ".static.flickr.com/" + photo.server + "/" + photo.id + "_" + photo.secret + "_" + "t.jpg";';
//$html = $html . 'var a_href = "http://www.flickr.com/photos/" + data.photoset.owner + "/" + photo.id + "/";';
$html = $html . 'var a_href = "http://farm" + photo.farm + ".static.flickr.com/" + photo.server + "/" + photo.id + "_" + photo.secret + "_" + "c.jpg";';
$html = $html . '$("<img/>").attr("src", img_src).appendTo(".flimg.' . $boxnum . '").wrap(("<a href=" + a_href + " data-caption=" + photo.title + " ></a>"))';
$html = $html . '});};';
return $html . $json . ';</script>';
// }
//return '<div class="flimg"></div><script type="text/javascript">var apiCall = ' . $obj . ';flk_gallery();</script>';
// return '<div class="flimg"></div><script type="text/javascript">var apiCall = ' . $obj . ';flk_gallery();</script>';
}
add_shortcode('flimg', 'flimg_Func');
ただこれだとflickrのアルバムIDとかはもろばれになってしまうのです。
本当はIDをキーにphpでjsonを生成して（もしくはjsonをjavascriptの変数に格納し）表示側はその値をcallbackで受けたかったんですがそこまではできてないです
…うむむ。