ギャラリープラグイン「GT3」でスクエアギャラリーを作成

ギャラリープラグインは数多くありますが、それぞれに特徴があります。以前紹介したModulaは、ランダム形状でギャラリーを作るのが得意でしたが、同じ形状のギャラリーを作成するのが不得意でした。

今回はレスポンシブレイアウト対応のギャラリープラグイン「GT3」でスクエア（正方形）ギャラリーを作成しました。

トップのスライダーはSmart Slider3で作成し、タイトルを固定で表示しています。スライドを追加＞静的オーバーレイを作成し、イラストとタイトルを中央に入れました。

メインは、画像の上に「33:66」のカラムを入れ、ブロックごとに左右交互にしました。

商品詳細は、以前紹介したPopup Makerを使用しました。

では本題です。まずGT3をダウンロード有効します。デフォルトの設定画面が表示されるので以下のように設定します。終了後「Save Settings」をクリックします。

項目	設定値
Gallery Type	Grid
Grid Type	Square
Link Image To	Light Box
Show Image Title	off
Show Caption Text	off
Image Size	Thumbnail(768px)
Columns	3
Margin, px	20
Corners Type	Standard
Image Border	off

左のサイドメニューにGT3 Galleries＞Add Newをクリックします。タイトルを入力し、下の「GT3 Gallery Custom Post Type」をクリックします。左サイドバーのブロック＞Gallery Imagesの「Add Media」をクリックします。

メディアライブラリーが開くので、ギャラリーに載せる画像を選択します。右サイドバーのサムネイルから、表示したい順番に並びかえます。

上の「公開」をクリックし、ブロック＞Shortcodeのショートコードをコピーします。あとは、ギャラリーを表示したい場所にショートコードブロックを設置し、ショートコードをペーストすれば完成です。

画像をスクエアに切り取ると見た目がよくなりますね。他にも、画像の比率を3:4や16:9に変更できます。モダールウィンドウのデザインも綺麗なので、色々使えるギャラリーだと思います。

Webサイト作成のご依頼は、コンタクトフォームよりよろしくお願いします。