一番良さそうなLightbox。
画像を拡大表示できるLightbox系WordPressプラグイン『ARI Fancy Lightbox』の使い方を紹介します。
目次
本記事の趣旨と目的
- 『ARI Fancy Lightbox』を導入する。
- どういう機能があるかを知る。
簡単に『ARI Fancy Lightbox』について説明し、導入後の設定について解説していきます。また、どうして数あるLightbox系WordPressプラグインの中で、『ARI Fancy Lightbox』を使うのかも、少しだけ話しておきます。
『ARI Fancy Lightbox』って？
Lightbox系WordPressプラグイン『ARI Fancy Lightbox』。
この『ARI Fancy Lightbox』は、Lightbox系WordPressプラグインです。
Lightboxとは、画像を拡大表示できる機能のことです。必須なプラグインではありませんが、ある便利なプラグインのひとつです。
利用イメージ
-
- 画像をクリックすると…。
-
- このようなLightboxが表示される。
デフォルトだと、このような表示になります。
ARI Fancy Lightboxを導入する方法
ARI Fancy Lightboxは、
- WordPress内のプラグイン項目からインストール。
- WordPress公式サイトから入手・インストール。
の2つの方法があります。
この『ARI Fancy Lightbox』は、WordPressプラグインですので、導入方法はほかのWordPressプラグインのインストール方法と同じです。なので、ここでの詳しい導入方法は割愛します。
各種設定
それでは、ARI Fancy Lightboxの各種設定について、詳しく見ていきます。
ちなみに、設定画面には、WordPressの左側のメニュータブにARI Fancy Lightboxと表示されるので、そちらを選択して入ることができます。
Integration
赤枠で囲った部分にチェックを入れれば、とりあえずは使える。
- WordPress Galleries
- Convert WordPress galleries（ギャラリー画像のLightbox表示）
- Navigate between items（ギャラリー画像のスライドショー表示）
- Images
- Convert links to images（単一画像のLightbox表示）
- Navigate between attachments（ページ全体の画像をギャラリー風に表示）
- Custom grouping selectors（画像のグループ化設定）
- Get title from EXIF data（EXIFデータからタイトルを取得）
- Convert file name to title（ファイル名をタイトルを取得）
- Smart title（ファイル名の変換）
- YouTube videos
- Convert YouTube links（動画をLightbox表示）
- Vimeo videos
- Convert Vimeo links（動画をLightbox表示）
- Metacafe videos
- Convert Metacafe links（動画をLightbox表示）
- Dailymotion videos
- Convert Dailymotion links（動画をLightbox表示）
- Vine videos
- Convert Vine links（動画をLightbox表示）
- Instagram content
- Convert Instagram links（Instagram画像のLightbox表示）
- Google Maps links
- Convert Google Maps links（GoogleマップのLightbox表示）
- Show marker（場所のマーカー表示）
- PDF files
- Convert PDF links（PDFのLightbox表示）
- Open external links into lightbox
- Convert links（外部リンクのLightbox表示）
この『Integration』では、ARI Fancy Lightboxの一般的な設定が行えます。
かなり設定項目が多いのですが、上画像の赤枠で囲った部分にチェックが入っていれば、特に問題なくプラグインを使うことができるはずです。
Lightbox
Lightbox自体の細かい設定が可能。
- Lightbox
- Animation effect（アニメーション効果）
- Animation speed (ms)（アニメーション速度）
- Transition effect（トランジション時のアニメーション効果）
- Transition fx speed (ms)（トランジション継続時間）
- Idle time (sec)（待機時間）
- Slideshow pause (ms)（スライドショー待機時間）
- Slideshow auto start（スライドショーの自動開始）
- Loop navigation（ギャラリーのループ再生）
- Show navigation arrows（ナビゲーション用の矢印表示）
- Close on outside click（Lightboxを閉じる範囲）
- Keyboard navigation（キーボードショートカット有効化）
- Enable gestures（ジェスチャー有効化）
- Focus the first element（最初の要素にフォーカス設定）
- Show info bar（情報表示）
- Show buttons（メニューボタン表示）
- Buttons（表示するボタン）
この『Lightbox』では、Lightbox自体の設定を行います。
非常に細かく設定できるプラグインですが、基本的にはデフォルトのままで問題ないと思います。ちなみに、上画像はデフォルト値です。
Style
Lightboxのデザインを変更可能。
この『Style』では、Lightboxのデザイン（色・透明度など）を変更ことができます。また、カスタムCSSを記述したり、z-indexが競合する場合の優先度も設定できます。ちなみに、上画像はデフォルト値です。
Advanced
ここでは拡張設定が可能。
この『Advanced』では、アンインストール時の挙動やカスタムJavaScriptを記述できます。ちなみに、上画像はデフォルト値です。
Upgrade
Pro版へのアップグレードが可能。
この『Upgrade』では、Pro版へのアップグレードが可能です。
Pro版にすると、Lightboxに固有のリンクが生成できたり、ディープリンクで開くことができるようです。おそらく、通常利用の用途範囲内だと、Pro版にする必要は少ないかも知れません。
注意点
- リンク先をメディアファイルにする。
リンク先の設定を間違うと、Lightboxが使えない。
おそらく、これはLightbox系プラグイン全般に言えることなのですが、画像のリンク先はメディアファイルに設定しておきましょう。
でないと、プラグインで設定しているのに、実際はLightbox表示されないという現象が起きてしまいます。初歩的なミスですが、要注意。
補足
最後に、数あるLightbox系プラグインの中で、どうして『ARI Fancy Lightbox』を使うことにしたかを書いておきます。
多機能なのに分かりやすい。
このARI Fancy Lightboxの魅力として、機能の多さがあると思います。もちろん、それも魅力のひとつなのですが、個人的にはそれよりも“見やすさ”や“使いやすさ”が、このプラグインの最大の魅力な気がします。なので、このARI Fancy Lightboxを選びました。
矢印・閉じる・スライドショーなどの各ボタンの配置や大きさも、PCだけでなくスマートフォンにも最適化されており、モバイルフレンドリーなLightbox系プラグインだと思います。
まとめの一言「Lightbox系プラグインの決定版だ」
今回は、WordPressのLightbox系プラグインである『ARI Fancy Lightbox』の使い方や機能を解説していきました。
- Lightbox系プラグインの中で良さそう
- めっちゃ多機能なのに使いやすい
って、感じかなー？
ほかにも良さそうなLightbox系プラグインはありますが、当面はARI Fancy Lightboxを使っていく予定です。
コメントを残す
コメントを投稿するにはログインしてください。