カメラ WEBサービス WordPress

WP,Flickr連動 FlickrExで、EXIF情報を取得、表示する方法

前回ポストで紹介したWPとFlickrの連携の続き。Flickrから引っ張って表示している写真に、EXIF情報を自動表示するようにもしたいと思います。

EXIF情報を自動表示させる

ブログパーツ「FlickrEx」を利用する

「FlickrEx」というブログパーツを利用します。
FlickrExについては以下を参照してください。

プラグイン化してやろうかとも思いましたが、読むと、WPのheaderテンプレートに記述するだけの簡単仕様でした。
なので、説明されている通りにしてみたいと思います。
が、ちょいと注意。

上記を読むと、GitHubに設置してあるコードを参照していたのができなくなった、ということで、jsファイルの参照先が変わっているようです。

ということで、以下のようにheaderテンプレの wp_head(); の後辺りに記述。
FLICKREX_API_KEY と FLICKREX_EXIF_JQUERY_SELECTOR も無くし、jQueryは既に読み込ませているので、純粋に FlickrEx 関係の.jsファイルだけを読ませる形としました。

FLICKREX_EXIF_FORMAT は個人的趣味として、紹介されているデフォルトに加えて、レンズモデル(%Lens Model%)とホワイトバランス(%Light Source%)を追記しました。
※カメラ側の設定か、レンズ名は表示してくれませんでした(汗)

編集したheaderテンプレートをアップロードしてリロードすれば、写真の下にEXIF情報をテキストで表示してくれます。

CSS

スタイル関係も元サイトにある通り、 .flickr-exif クラスを用意して書けば良いだけなので、以下のようにしてみました。

うむ、シンプル。

これで、このようになってくれます。

DSC_6182

素敵。

-カメラ, WEBサービス, WordPress
-, , , , ,