WordPress（ワードプレス）の無料ギャラリープラグインにはいろいろありますが、Robo Gallery はレスポンシブ対応でグリッドスタイルのデザインも可能な便利なプラグインになります。有料の Pro 版もありますが購入しなくてもかなり使えるプラグインです。ここでそのインストール方法と機能について説明します。
ワードプレス無料ギャラリー
Robo Gallery 設定と機能
１．Robo Gallery のインストール
ワードプレスのダッシュボードの「プラグイン」＞「新規追加」から、「Robo」と入力して「Image Gallery by Robo – Responsive Photo Gallery」を検索します。
「今すぐインストール」をクリックしインストールし有効化します。有効化すると Overview が表示されます。
２．ギャラリーを作成しサイトに配置する
１）新規ギャラリーを作成する
 | ワードプレスのダッシュボードに Robo Gallery が表示されているのでそれをクリックします。 |
 | Add Gallery / Images をクリックします。 |
(1) ギャラリーのタイトルを設定する
表示される画面で「タイトルを追加」に好きなタイトルを入力します。日本語も使えます。
(2) キャッシュを設定する
「Cache」でギャラリーキャッシュ機能を使うかどうか設定できます。速度を早くしたいので「Enable」に設定します。
(3) ギャラリーサイズ等の設定をする
「Gallery Size Options」でギャラリーのサイズ等の設定を行います。
- Width：ギャラリーを表示するページ内の範囲を％で指定します
- Gallery Allignment：ギャラリーの表示位置
- Padding：ギャラリーのパディング（余白）を指定します
- Order By：並び順を変更できます
- Thumbnails Quality：サムネイルの画質設定
- Custom Ratio：縦横比を下記のように自分で設定できるようになります
- Res.Width：横幅
- Res.Height：高さ
Size Options でグリッドのカラム数とサイズを指定できます。Pro 版を購入しないと解像度は 450 しか選べません。
- Auto Size：自動でサイズ調整されます（Off にするとCustom Sizeが選べます）
- Columns Count：カラムの数を選べます
(4) サムネイルの設定をする
「Thumbs View Options」で各サムネイル画像の設定をします。
- Radius：角の丸めの設定
- Hor. Space：横の間隔の設定
- Ver. Space：縦の間隔の設定
- Shadow：サムネイルに影を入れるかどうか（Off にすると下記の影の詳細設定は消えます）
「Shadow Options」で影の設定を行います。
- H-shadow：横方向の影の設定
- V-shadow：縦方向の影の設定
- Blur：影のぼかしの程度を設定
- Color：影の色の設定
「Hover Shadow Options」はプロ版でないと利用できませんが、マウスオーバーしたときの影の設定を変更できます。
「Border」を On にすると、ボーダーライン（枠線）を設定できます。
- Width：枠線の幅の設定
- Style：枠線のスタイルの設定（点線や二重線などいろいろ選べます）
- Color：枠線の色の設定
他にもいろいろ細かい設定がありますが、先に写真の追加をしてギャラリーを完成させることにしましょう。
２）ギャラリーに写真を追加する
(1) Manage Images をクリックする
 | 「Manage Images」をクリックします。 |
ギャラリー追加の画面が表示されるので、追加したい写真を選び、「ギャラリーに追加」をクリックします。
３）ギャラリーを公開する
 | 公開パネルの「公開」をクリックします。 |
ギャラリーを公開すると、タイトルの下にパーマリンクが表示されます。日本語のタイトルだとパーマリンクも日本語となってしまうので、修正の必要があれば「編集」をクリックして修正しましょう。
クリックすれば下記のようにギャラリーページを呼び出せます。
このパーマリンクをページに貼ってリンク表示することもできますが、ショートコードを利用してギャラリーのみ呼び出すことも可能です。下記で説明します。
４）ギャラリーをページに配置する
(1) ショートコードをコピーする
 | 「Gallery Shortcode」のパネルから作成したギャラリーのショートコードをコピーできます。 |
 | あるいは「Manage Galleries」をクリックしたときに表示される下記画面の赤枠部分に表示されているのでコピーできます。 |
(2) ショートコードをページに配置する
コピーしたショートコードをページに配置します。
 | 作成したページの「＋」（ブロックの追加）をクリックします。 |
 | 「ウィジェット」の「ショートコード」ブロックを追加します。 |
下記のショートコードブロックが追加されるので、先ほどコピーしたショートコードを貼り付けます。
以上でページへの配置が完成し、ページを表示すると下記のようにギャラリーが配置され表示されます。
Robo Gallery は上のようなギャラリーを簡単な操作にて設置できます。有料のプランもありますが、無料でもいろいろな設定が可能です。おすすめな無料ギャラリープラグインの一つです。
補足．Robo Gallery のその他の設定
１）Hover Options の設定
ホバー（マウスオーバー）した時の設定を変更できます。
- Clickable Thumbnails：サムネイル全体をクリック機能できるようにする
- Hover Mode：ホバーモードの切り替え設定（Proのみ）
- No Hover for Mobile：モバイルでのホバー表示を切る設定
- Bg Color：背景色の設定（Proのみ）
- Effect：ホバーによる表示効果の設定
(1) Title
 | サムネイル写真のタイトル表示の設定です。 |
- Show：タイトルの表示・非表示を切り替える
- Font Style：文字の「Bold：太字、Italic：斜体、Underline：下線」
- Font Size：文字の大きさ
- Line Height：下線の高さ
- Color：文字色
- Hover Color：ホバーした時の色
(2) Zoom Button
 | サムネイルのズームボタンの設定です。 |
２）Loading Options の設定
Lazy Load を On にすることで、画像の遅延読み込みを設定できます。SEO対策的に意味のあるページをより早く表示させることは重要ですが、写真は重いので読み込みを後にして、ページを先に表示させるといったことを可能とします。
- Images Amount：ページの最初で読み込む写真の枚数を指定します
- Load More Amount：追加で読み込む枚数を指定します
 |
|
３）Polaroid Style Options の設定
 | 「Polaroid Style」を On にすると、ギャラリーの表示をポラロイド調にできます。文字列はタイトルとデスクリプションとキャプションから選べます。 |
４）Lightbox Options の設定
Lightbox Options ではライトボックス（写真の拡大表示）の設定を行えます。
- Text：ライトボックス画面にテキストを表示するかどうかの設定
- Text Source：表示文字（Title、Description、Captionから選べる）
- Deep Linking：画像ごとにURLを作成するかどうかの設定
- Images Counter：画像番号の表示設定
- Swipe：スワイプで画像を変更させるかどうかの設定
- Mobile Style：モバイルで画像に文字を表示させるかどうかの設定
(1) Control Buttons の設定
ライトボックスのコントロールボタンの設定を行えます。
- Close Icon：閉じるボタンを設定
- Arrow Icon：矢印ボタンを設定
- Source Button：ソースボタンを設定
ソースボタンを設定すると、ライトボックス表示の画像に、画像へのリンクボタンが設定されます。
(2) Lightbox Description Panel の設定
ライトボックスの説明パネルを表示設定できます。
- Panel：パネルの表示設定
- Description Source：文字の選択（Title、Description、Caption）
- Description Style：スタイルの設定
