Lightbox Gallery plugin

WordPress 2.5の新機能 ギャラリーを使って画像一覧表示するという記事でWordPress 2.5からの新機能であるの使い方を説明したが、このgalleryを使ってフォトログや写真アルバムサイトを構築するにはいまいち役不足だったので、を拡張してプラグイン化してみた。その名も、Lightbox Galleryというプラグインである。

Lightbox Gallery [ English here ]

必須条件
WordPress 2.5以上

特徴
Lightbox Galleryは、の機能を拡張し、Lightboxで画像・写真を表示できるように変更するプラグインである。Lightbox Galleryの主な特徴は以下のとおり。

• Lightboxで画像・写真を表示
• Tooltip（ツールチップ）で画像のキャプションを表示
• 写真の一覧表示はローディングっぽく遅延表示
• 写真の付随情報（機種・絞り値など）を表示
• ギャラリーの分割表示

ヒストリー

• 2016.04.27 Lightbox Gallery 0.8.3 公開
  • コードクリーニング。
• 2015.04.08 Lightbox Gallery 0.8.2 公開
  • 子テーマでの CSS 読込。
• 2015.03.07 Lightbox Gallery 0.8.1 公開
  • 後方互換性：キャプション読込。
  • コードクリーニング。
• 2015.02.17 Lightbox Gallery 0.8 公開
  • レスポンシブな出力対応。
  • ギャラリーコードの改善。
• 2013.01.18 Lightbox Gallery 0.7.4 公開
  • バグフィックス：WordPress 3.5 対応。
• 2012.07.14 Lightbox Gallery 0.7.3 公開
  • バグフィックス：rel="lightbox" での表示。
• 2012.05.08 Lightbox Gallery 0.7.2 公開
  • バグフィックス：Lightbox の画像パス。
• 2012.05.01 Lightbox Gallery 0.7.1 公開
  • GPLライセンス制限のため、デフォルトを Colorbox に変更。このサイトで配布しているファイルには、Lightbox のスクリプトが含まれますが、公式ディレクトリの配布には含まれていないため、Lightbox Gallery の設定画面よりスクリプトを取得する必要があります。
  • スロバキア語。
• 2012.02.22 Lightbox Gallery 0.6.8 公開
  • GPLライセンス制限のため、highslide.js を削除。highslideを使用する場合は、設定画面に従ってファイルを設置してください。
  • バグフィックス： キーボードでの写真送り。
• 2012.01.27 Lightbox Gallery 0.6.7 公開
  • バグフィックス： サブディレクトリにインストールしたWordPressでのボタン画像。
  • スウェーデン語。
• 2012.01.12 Lightbox Gallery 0.6.6 公開
  • rel="lightbox" を自動的に投稿挿入時に追加するオプション。
  • コード整備。
  • バグフィックス： esc_attr() の追加。
  • クロアチア語、ヒンディー語、簡体字中国語。
• 2011.03.25 Lightbox Gallery 0.6.5 公開
  • WordPressをサブディレクトリにインストールした場合に、自動でlightbox とhighslideのパスを設定。
  • チェコ語、ドイツ語、ルーマニア語
• 2010.07.28 Lightbox Gallery 0.6.3 公開
  • jQuery lightBox plugin のライセンス変更。
  • ハンガリー語
• 2009.12.21 Lightbox Gallery 0.6.2 公開
  • スクリプトをすべてのページで読み込むオプションの追加。
• 2009.11.09 Lightbox Gallery 0.6.1 公開
  • バグフィックス：JavaScriptエラー。
• 2009.11.08 Lightbox Gallery 0.6 公開
  • にclass属性を設定すると、ギャラリーが分割表示されます。
  • Highslide JSのサポート
  • JavaScriptのフッターロード
• 2009.09.10 Lightbox Gallery 0.5 公開
  • jquery.lightbox.cssとjquery.tooltip.cssをlightbox-gallery.cssに統合
  • ベラルーシ語、ブラジルポルトガル語
• 2009.07.28 Lightbox Gallery 0.4.7 公開
  • デフォルトのサムネイルサイズ、lightboxサイズの追加
• 2009.07.23 Lightbox Gallery 0.4.6 公開
  • スペイン語、ポーランド語
  • バグフィックス：翻訳不完全部分
• 2009.07.02 Lightbox Gallery 0.4.5 公開
  • オランダ語
• 2009.06.03 Lightbox Gallery 0.4.4 公開
  • フランス語
• 2009.05.25 Lightbox Gallery 0.4.3 公開
  • ロシア語
  • バグフィックス：JavaScript
• 2009.05.15 Lightbox Gallery 0.4.2 公開
  • ページナビゲーションのバグ修正
• 2009.05.14 Lightbox Gallery 0.4.1 公開
  • lightbox-gallery.jsをテーマディレクトリから読み込めるように。
  • イタリア語
• 2009.04.27 Lightbox Gallery 0.4 公開
  • from, num属性の追加。ギャラリーの分割。
  • 管理画面で各種オプション設定。
• 2008.09.30 Lightbox Gallery 0.3.1 公開
  • バグフィックス。
• 2008.09.30 Lightbox Gallery 0.3 公開
  画像をゆっくり表示させている方は更新時にlightbox-gallery.jsの7行、8行目のコメント化を解除してください。
  • １ページに表示する画像枚数が多くなった場合にLightboxが表示されない不具合を修正。特にSafari。
  • js、cssをギャラリーがあるページのみ読み込み。
• 2008.09.05 Lightbox Gallery 0.2.6 公開
  • バグフィックス。
• 2008.08.24 Lightbox Gallery 0.2.5 公開
  • バグフィックス。
• 2008.08.21 Lightbox Gallery 0.2.4 公開
  • rel=”nofollow”に対応。画像の説明にリンクタグがあった場合のバグ修正。lightbox-gallery.cssのテーマ場所への設置対応。
• 2008.07.16 Lightbox Gallery 0.2.3 公開
  • WordPress 2.5と2.6でorderbyの指定方法が異なる点を修正。
• 2008.07.15 Lightbox Gallery 0.2.2 公開
  • WordPress 2.6のソースベースに変更。ISOを追加。
• 2008.05.08 Lightbox Gallery 0.2.1 公開
  • のclass属性の追加。
• 2008.05.08 Lightbox Gallery 0.2 公開
  • ショートコードのを使わずにlightboxで画像を表示する（rel=”lightbox”）のサポート
• 2008.04.22 Lightbox Gallery 0.1 公開

ダウンロード
Lightbox Galleryプラグインのダウンロードは下記のリンクをクリックしてください。

または

インストール

1. Lightbox Galleryプラグインをインストールするには、上記の圧縮ファイルを解凍し、lightbox-gallery.jsの2行目のパスをご利用の環境に合わせて設定する。
2. lightbox-galleryディレクトリをそのままwp-content/pluginsディレクトリにアップロードし、Lightbox Galleryを有効化する。

テーマファイルの場所にlightbox-gallery.cssやlightbox-gallery.jsがある場合はそちらを読み込みます。ない場合はLightbox Gallery pluginにあるlightbox-gallery.cssとlightbox-gallery.jsを読みます。cssやJavaScriptを変更する場合は、テーマファイルの場所にlightbox-gallery.cssとlightbox-gallery.jsを置いておくと、プラグインのアップグレード時に上書きせずに済みます。

寄付

プラグインがお気に召しましたら、よろしければ下記のPaypalリンクよりご寄付ください。よろしくお願いいたします。

使用方法
Lightbox Galleryを使用方法は、WordPress 2.5以降に搭載されているギャラリーと基本的には同じである。写真を複数登録し、タグを投稿欄に挿入するだけである。写真のキャプションは、マウスが画像の上にくるとtooltip（ツールチップ）として表示され、写真の説明はLightboxが表示される際に表示される。

上級設定
のショートコードのオプションは全て使用できる。詳しいオプションについては、WordPress 2.5の新機能 ギャラリーを使って画像一覧表示するを参照してほしい。ここでは、標準のオプションに加えて、Lightbox Galleryで付け加えたオプションを説明する。

• lightboxsize
  lightboxsizeに指定した大きさでLightboxを表示する。デフォルトではmedium になっているが、full に指定することも可能。

• meta
  metaは写真の付随情報を表示するかどうかを指定する。デフォルトではfalseになっており、表示されない。表示したい場合はtrueを指定する。写真の付随情報は、カメラの機種、絞り値、焦点距離、ISO、シャッタースピード、撮影日時をLightboxに表示する。

• class
  classはgalleryのクラス属性を追加する。デフォルトではgallery1になっている。

• nofollow
  rel=”nofollow”を追加する。デフォルトではfalseになっている。

• from, num
  fromは表示する画像位置、numは表示したい画像数。以下は3枚目の画像から5枚画像を表示する例。

• pagenavi
  numを使用時に画像数に応じて画像のナビゲーションリンクが表示される。pagenaviを0にセットすると、ナビゲーションリンクを表示させない。ナビゲーションについては、wp_link_pagesと同じオプションが使用できる。

[実例] Lightbox Galleryプラグインを使用した写真アルバム（フォトログ）サイト
このLightbox Galleryプラグインを使用し、テーマもカスタマイズしたサイトを作成した。記憶の記録＠GENTOKIというサイトで、筆者が実際に撮った写真を掲載している写真アルバム（フォトログ）サイトである。

記憶の記録＠GENTOKI

もし需要があるようならテーマファイルも公開したいと思う。要望はコメント欄やお問い合わせから。その他、不具合やご質問・感想等があれば何なりとおっしゃってほしい。

Lightbox Gallery
This plugin changes the view of galleries to the lightbox.

Requirement
WordPress 2.5

Features

• Lightbox display of Gallery
• Tooltip view of caption of images
• Displays the associated metadata with images

Download

OR

Install

1. Edit the `lightbox-gallery.js` and check the path of line 2 according to your settings.
2. Copy the `lightbox-gallery` directory into your `wp-content/plugins` directory
3. Activate the plugin through the ‘Plugins’ menu in WordPress
4. That’s it! :)

Lightbox Gallery will load ‘lightbox-gallery.css’ and ‘lightbox-gallery.js’ from your theme’s directory if they exist.
If they don’t exist, they will just load the default ‘lightbox-gallery.css’ and ‘lightbox-gallery.js’ that come with Lightbox Gallery. This will allow you to upgrade Lightbox Gallery without worrying about overwriting your lightbox gallery styles that you have created.

Donation

If you liked this plugin, please make a donation via paypal! Any amount is welcome. Your support is much appreciated.

History

• 2016.04.27 Lightbox Gallery 0.8.3 Release
  • Code cleaning.
• 2015.04.08 Lightbox Gallery 0.8.2 Release
  • CSS loading in a child theme.
• 2015.03.07 Lightbox Gallery 0.8.1 Release
  • Backward compatibility: caption loading.
  • Code cleaning.
• 2015.02.17 Lightbox Gallery 0.8 Release
  • Responsive output.
  • Gallery code renewal.
• 2013.01.18 Lightbox Gallery 0.7.4 Release
  • Bugfix: support for WordPress 3.5.
• 2012.07.14 Lightbox Gallery 0.7.3 Release
  • Bugfix: rel="lightbox".
• 2012.05.08 Lightbox Gallery 0.7.2 Release
  • Bugfix: lightbox image path.
• 2012.05.01 Lightbox Gallery 0.7.1 Release
  • From 0.7.1, the default view changed to Colorbox due to the license regulation by the plugin directory. If you would prefer the prior Lightbox to Colorbox, you need to get the script from the setting page.
  • Slovak (sk_SK) – Viliam Brozman
• 2012.02.22 Lightbox Gallery 0.6.8 Release
  • Due to the license restriction, the highslide script has been removed.
  • Bugfix: key transition.
• 2012.01.27 Lightbox Gallery 0.6.7 Release
  • Bugfix: button images of sub directory WordPress.
  • Swedish (sv_SE) – Anders Martensson
• 2012.01.12 Lightbox Gallery 0.6.6 Release
  • Option to add rel="lightbox" automatically in the post insert.
  • Code cleaning.
  • Bugfix: addition of esc_attr().
  • Croatian (hr) – Tomislav Konestabo
  • Hindi (hi_IN) – Outshine Solutions
  • Simplified Chinese (zh_CN) – leonanu
• 2011.03.25 Lightbox Gallery 0.6.5 Release
  • Lightbox and Highslide path.
  • Czech (cs_CZ) – Petufo
  • Germany (de_DE) – Michael Wruck and Tacitus Media
  • Romanian (ro_RO) – Anunturi Jibo
• 2010.07.28 Lightbox Gallery 0.6.3 Release
  • jQuery lightBox plugin license changed.
  • Hungarian (hu_HU) – Zsolt Vereb and Feriman
• 2009.12.21 Lightbox Gallery 0.6.2 Release
  • Enforced loading option of lightbox gallery scripts.
• 2009.11.09 Lightbox Gallery 0.6.1 Release
  • Bugfix: JavaScript error.
• 2009.11.08 Lightbox Gallery 0.6 Release
  • If you set the `class` attribute into , galleries are handled separately. ex)
  • Support for the Highslide JS.
  • Support for the javascript loading in the footer.
  • Turkish (tr_TR) – Hakan Demiray
• 2009.09.10 Lightbox Gallery 0.5 Release
  • Combine jquery.lightbox.css and jquery.tooltip.css into lightbox-gallery.css.
  • Brazilian Portuguese (pt_BR), Belorussian (be_BY)
• 2009.07.28 Lightbox Gallery 0.4.7 Release
  • Default thumbnail size and lightbox size.
• 2009.07.23 Lightbox Gallery 0.4.6 Release
  • Spanish, Polish
  • Bugfix: translation miss
• 2009.07.02 Lightbox Gallery 0.4.5 Release
  • Dutch
• 2009.06.03 Lightbox Gallery 0.4.4 Release
  • French
• 2009.05.25 Lightbox Gallery 0.4.3 Release
  • Russian
  • Bugfix: JavaScript
• 2009.05.15 Lightbox Gallery 0.4.2 Release
  • Bugfix: page navigation
• 2009.05.14 Lightbox Gallery 0.4.1 Release
  • Loads `lightbox-gallery.js` from your theme directory. Do not worry about overwriting in upgrade of the plugin any more.
  • Italian
• 2009.04.27 Lightbox Gallery 0.4 Release
  • Adds from and num attributes. Gallery Division.
  • Additional settings are set in the option page
• 2008.09.30 Lightbox Gallery 0.3.1 Release
  • Bugfix
• 2008.09.30 Lightbox Gallery 0.3 Release
  If you make images display slowly, please edit lightbox-gallery.js line 7 and 8.
  • Bugfix that lightbox does not work when images increase, especially Safari.
  • Output jquery and lightbox scripts only in the replated page.
• 2008.09.05 Lightbox Gallery 0.2.6 Release
  • Bugfix
• 2008.08.24 Lightbox Gallery 0.2.5 Release
  • Bugfix
• 2008.08.21 Lightbox Gallery 0.2.4 Release
  • Adds the nofollow attribute. A bugfix for the situation which includes link tags in the description field. Load ‘lightbox-gallery.css’ from your theme’s directory if it exists.
• 2008.07.16 Lightbox Gallery 0.2.3 Release
  • Fixes the orderby difference between WordPress 2.5 and 2.6.
• 2008.07.15 Lightbox Gallery 0.2.2 Release
  • Changes to the source based on WordPress 2.6. Adds the ISO attribute.
• 2008.05.08 Lightbox Gallery 0.2.1 Release
  • Adds a class attribute into .
• 2008.05.08 Lightbox Gallery 0.2 Release
  • Supports rel=”lightbox” to make regular images appear in a lightbox.
• 2008.04.22 Lightbox Gallery 0.1 Release

How to use
How to use this plugin is basically the same as the way to add which has been adopted by over WordPress 2.5. Lightbox Gallery plugin automatically converted the default view of gallery into the lightbox view. Photo captions are displayed as tooltips. Photo descriptions are displayed when the lightbox pops up.

Frequently Asked Questions
How can I make regular images appear in a lightbox without shortcode?
Just add rel=”lightbox” into “a” tag. Here is a sample.

<a href=”image.jpg” rel=”lightbox” title=”this is a caption”>
<img src=”thumbnail.jpg” alt=”” />
</a>

How can I handle multiple galleries in one page as saparate ones?
You need to do two steps. If you would like to handle galleries separately, add different class names into and add codes as many as class names into `lightbox-gallery.js`.

1. Edit `lightbox-gallery.js` and add some codes. Look at the comment of the file.
2. Add a class attribute into . ex)

Advanced settings
There are three additional options to extend the shorttag .

• lightboxsize
  The image size when the lightbox pops up. The default is medium, but you can change to full.

• meta
  Defines whether the exif information is displayed. The default is false. If you want to show the photo info, set true. The exif shown on the lightbox includes camera body, aperture, focal length, ISO, shutter speed, and created timestamp.

• class
  Adds a class of the gallery. The default is ‘gallery1’.

• nofollow
  Adds the attribute, rel=”nofollow”. The default is false.

• from, num
  Defines from which and how many photos are displayed. If the number of photos is over that of num, the navigation will be shown. You can use the navigation option almost same as the wp_link_pages function.

• pagenavi
  If you would like not to show the navigation, set 0. The default is 1.

Demo
See Record of memory @ GENTOKI.
It’s my photo album site.

Thanks.