Jetpackで、画像フィルター付きのタイルギャラリーを作成

インスタグラムなどでは、画像をアップする時、画像フィルターをかけて印象的な写真にすることができます。今回は、Jetpackで、画像フィルター付きのタイルギャラリーを作成する方法を紹介します。

今回のDEMOは、JAZZ LIVEのギャラリーです。

セピア調のギャラリーです。PC、SPレイアウトは変わりません。PCはスクロール表示、SPは1画面表示になります。

ギャラリー作成

プラグインを、インストール、有効化します。ブロックエディターのメディア＞タイルギャラリーをクリックします。ブロックが挿入されるので、メディアライブラリボタンをクリックします。

メディアライブラリからギャラリーに入れる画像を選択し、ギャラリーを作成をクリックします。ドラッグ&ドロップで並び替えして、ギャラリーを挿入をクリックします。ギャラリーが作成されます。

ギャラリーを選択し、画像フィルターを選択＞セピアをクリックします。ギャラリーの画像がセピア調になります。

並び替えしたい場合は、画像をクリックして、表示される左右の矢印をクリックします。画像が入れ替わり、それに合わせてレイアウトも変更されます。

入れ替えが終わったら保存し、プレビューを確認します。これで完成です。

以上で今回の説明は終了です。このほかにもモノクロや、フィルム調の画像フィルターがあるので、サイトのデザインに合わせて変更できます。