Flickr上の画像をlightbox表示するWordPressプラグイン"Flickr Gallery"

Check

私はiPhoneで撮影した画像でインターネット公開を前提にしているものは基本的にFlickr上にデータをおいております。

これらFlickr上の画像をlightboxエフェクトで表示するWordPress用プラグイン「Flickr Gallery」を導入してみました。

WordPress.org上でのFlickr Galleryプラグインページ
とりあえずプラグインをインストールしてアクティベート。

次に設定画面に進むのですが、その前にFlickrのAPI Key(及びFlickr API Secret)を取得しておく必要があります。

■Flickr API Keyの取得方法
1. Flickrの下記ページにアクセス
http://www.flickr.com/services/api/keys/
勿論Flickrのアカウントを持っていてログインしていることが前提です。

2.API keyのタイプを選択
「Apply for a Non-Commercial API Key」を選びます。

3.申請内容を入力
全項目に入力する必要があります。

1. Your first and last names
   氏名です。ログインしていれば自動的に表示されます。
2. Choose an email address for your application (from the list of verified email addresses on your account)
   emailアドレスです。これも自動的に表示されます。
3. Describe the project you’re building (and trust us when we say, you cannot be detailed enough)
   API Keyを何のために使うのか記載します。
4. Acknowledge that Flickr members own all rights to their content, and that it’s your responsibility to make sure that your project does not contravene those rights
   権利関係についてです。チェックボックスをチェックしましょう。
5. Agree to comply with the Flickr API Terms of Use
   Flickr APIの使用条件についてです。チェックボックスをチェックしましょう。

以上を入力したら「Submit Application」をクリック。以上でFlickr API KeyとFlickr API Secretを取得できます。

■Flickr Galleryの設定
次にWordPressのダッシュボードでFlickr Galleryの設定画面を開きます。
以下の項目に必要事項を入力します。

• Flickr API Key
  先ほど取得したAPI Keyを入力します。
• Flickr User ID
  右側のプルダウンで「User Name」を選べばFlickrのUser Nameを入力するだけです。
• Number of photos to display
  サムネイルを最大何枚表示するかです。適当に。
• Use a lightbox to display your photos
  チェックするだけでlightbox効果を得られます。

以下の2点はプライベートな写真を含みたい場合に入力します。

• Flickr API Secret
  先ほど取得したAPI Secretを入力します。
• Authentication Token
  generateをクリックして許可を与えておきます。

最後にこれを選択。

• Show a small credit link for the plugin under your galleries
  ギャラリーの下に「Powered by Flickr Gallery」というクレジットを入れる場合はチェックします。

ここで「save changes」をクリックすれば下にFlickr上の画像のサムネイルが何枚か表示されるはずです。そうすれば設定は終わりです。

■投稿ページ内に記入するコード
Flickr Galleryを投稿内に設置する際には以下のコードを本文内に記載します。
プラグイン制作者さんのページを適当に邦訳します。
全部試したわけではないので間違っていたらゴメンナサイ。

• [flickr-gallery]
  設定通りの通常のギャラリーを作ります。
• [flickr]http://www.flickr.com/photos/kubohjpn/3866666197/[/flickr]
  指定した画像を表示します。真ん中のURLは指定したい画像をFlickrで表示した際のURLを記載します。
• [flickr-gallery mode=”photoset” photoset=”72157622547300916″]
  FlickrのSetを指定してギャラリー表示させます。photoset=”数字”の数字部分に指定したいSetをFlickrで表示した際のURLの最後に表示されている数字を記載します。
• [flickr-gallery mode=”tag” tags=”cafe” tag_mode=”all”]
  tag=”タグ名”で指定したタグを持つphotostreamを表示するギャラリーを作ります。タグはコンマで区切って複数指定できそうです。
• [flickr-gallery mode=”recent”]
  photostreamから最近の写真を表示します。
• [flickr-gallery mode=”interesting”]
  photostreamからinterestingなものを表示するらしいです。
• [flickr-gallery mode=”search” tags=”wine” group_id=”46862018@N00″]
  とりあえずいろいろな検索ができるらしいのですが、詳しくはhttp://www.flickr.com/services/api/flickr.photos.search.htmlの検索パラメータ一覧を見てください。
• [flickr size=”small” float=”left”]http://www.flickr.com/photos/dancoulter/2619594365/[/flickr]
  画像サイズをsmallにします(通常はmedium)。また、画像を左に配置してテキストが右に回り込むようにします。(float=”right”にしたら勿論逆になるわけだが)
• [flickr height=”300″ width=”400″]http://www.flickr.com/photos/dancoulter/2422361554/[/flickr]
  動画を組み込めます。自動的にFlashムービーになるようです。サイズはwidthとheightの値で変更可能です。

ちょっと最後の方は適当になってしまったので、詳しくはプラグイン制作者のサイトをご覧ください。