ギャラリーをシンプルに製作・表示するプラグイン「Gallery」

先日、普段からお世話になっている絵動のページに「GALLERY」が追加されました。
メンバーの七竈さんのイラストが閲覧可能になっています。
そして、このページは僕が作成をさせて頂きました。
ページのギャラリー製作に利用したのが「Gallery」というプラグインです。
Gallery使用のメリット
- 簡単にギャラリーページが作成可能
- ギャラリーをまとめたアルバムも作成可能
- 簡単にギャラリーを管理することが出来る
写真やイラストを掲載しているサイトにとって非常に心強いプラグインです。
ギャラリー完成図
画像をクリックするとポップアップで画像が表示されます。
Galleryの導入方法
通常のプラグインと同じように
管理画面の左サイドバー「プラグイン」 > 新規追加 > Galleryで検索
Galleryをインストールして有効化しましょう
Galleryの設定
有効化をすると
管理画面の左サイドバーに「Galleries」が追加されます。
新しくギャラリーを作成する場合は「Add a Gallery」をクリックします。
これがギャラリーを作成するページになります。
個別ページや投稿記事と同じようなかたちでページを作成できます。
固定ページや投稿記事と同じように「タイトルの設定」や本文の追加ができます。
ギャラリーの説明などがある場合は説明文を追加しておきましょう。
ギャラリー製作ページの下に画像を投稿する場所があります。
ここに画像をドロップ&ドラックすることで画像をギャラリーに追加出来ます。
上記が画像を挿入した様子です。
ここで一回「更新」ボタンを押して画像を反映させましょう。
こんな感じでギャラリーに画像が追加されます。
画像のタイトルや画像のAit tagの設定がここで出来ます。
タイトルは画像の下に表示され、Ait tagは画像のポップアップ時に表示されます。
また、ここで画像の並び替えが可能です。
ドロップ&ドラックで画像を自由に移動出来ます。
設定が終わったら、更新ボタンをクリックしましょう。
Galleryの設置
ギャラリー作成のページのサイドバーに「ギャラリー用のショートコード」が用意されているので、ギャラリーを公開したいページにこのショートコードを記載しましょう。
これでギャラリーの挿入が可能です。
Galleryの管理
作成したギャラリーのリストは「Galleries」に追加されます。
作成済みのギャラリーにイラストを追加する場合などはここから編集します。
Galleryの表示設定
ギャラリーのサムネイルサイズなど詳細を指定する場合は「BWS Plugins」のGalleryをクリックします。
項目が多いので個別にわけて説明をしていきます。
また、絵動で使用している機能に絞って今回はご紹介します。
画像サムネイルのサイズ指定
ここでは、画像のサムネイルサイズの指定ができます。
絵動ではサイズを160✕160に指定しています。
画像サムネイルの枠線指定
画像の枠線の有無やカラー・線の太さを指定できます。
またサムネイルの列の数をここで表示できます。
絵動で「100」と指定しているのはレスポンシブ・デザインのサイトの場合、3や4などで設定を行うと表示がおかしくなったからです。
この部分は各自で表示を試してみてください。
表示画像の順番設定
ここで画像の表示順番を指定することが出来ます。
絵動では「Sorting order (the input field for sorting order in the Insert / Upload Media Gallery dialog)」を選択し、自由に移動が出来るかたちにしています。
まとめ
シンプルなギャラリー作成プラグイン「Gallery」いかがだったでしょうか?
こちらが完成したギャラリーになります。
素敵なイラストも公開されているのでぜひ、ご確認ください!
絵動では、アルバム表示は利用していないので説明は省かせて頂きました。
下記のサイト様ではアルバム設定に関する説明がされています。
作成時は参考にしてみてください。
それでは、便利なギャラリーを作成してみてください!