WordPressの使い方：ギャラリーの追加方法

2021年5月24日

ブロックエディタでのギャラリーの作成方法をご紹介します！

ギャラリーとは？

複数の画像を一覧形式で表示させることができます。
ブロックエディタでは、複数の画像を指定したカラム数で整列させるブロックを作成することで、統一感のあるギャラリーを追加することが可能です。

ギャラリーブロックを追加する

まずはブロックエディタでギャラリーブロックを追加します。
ギャラリーを追加したい固定ページ・投稿ページを開き、
横の『+』マークをクリック。※1
もしくは左上『+』マークをクリック。

※1
最近使ったブロックやよく使うブロックが表示されます。その中にギャラリーが無い場合、下の『すべて表示』をクリックします。

ブロックエディタ一覧が表示されましたら『ギャラリー』を探します。
“メディア"の中にありますので、クリック。

配置したい場所にギャラリーブロックが追加されます。

画像を選択する

ギャラリーブロックに画像を入れていきます。

①アップロードしていない場合は『アップロード』、
②すでにしている場合は『メディアライブラリ』をクリック

①アップロードしていない場合

画像をアップロードします。
最大アップロードサイズは設定によって変動します。
アップロードする画像は必ず半角英数字にしてください。
文字化けの原因となり、バックアップを取る際に正常に行われない場合があります。

②すでにしている場合

ギャラリーに表示したい画像にチェックマークを入れていきます。
選択できましたら、右下の『ギャラリーを作成』をクリック。

ギャラリーを編集する画面になります。
画像の入れ替えを行う場合はドラッグ＆ドロップで行えます。

画像をクリックすると右側に詳細が表示されますので、代替テキストやキャプションが必要ならば入力します。

代替テキスト	画像などテキストコンテンツになっていないものに記述する説明文。読み上げソフトを利用した場合に画像の情報を認識しやすくなります。
キャプション	画像の説明分。
説明	HTML、ホームページ上に表示されません。自分用の画像のメモとして使用できます。

『ギャラリーを挿入』でページにギャラリーを追加することができます。

無事ギャラリーが追加されました。

ギャラリー画像の並び替え・削除・追加

画像の並び替えや削除を行う場合は、対象画像をクリックするとアイコンが表示されます。
キャプションの追加も行えます。

作成後にギャラリーに画像を追加する場合は、ギャラリー下にある『メディアライブラリ』をクリックすることで行えます。
手順は作成時と同じです。

カラムの変更

ギャラリーはカラムで表示されます。デフォルトは３です。

横に何枚表示させるかで画像の大きさが変化します。

4カラムに6枚配置すると、溢れた2枚が大きく表示されます。

5カラムに6枚配置すると、溢れた1枚が大きく表示されます。

バラバラの大きさが並ぶギャラリーは作成できません。

カラムの最大数は８となっています。
9枚の画像を横に並べることはできませんのでご注意ください。

画像をクリックすることで大きく表示させるにはリンク先を『メディアファイル』にします。

画像をクリックすると大きく表示されます。

画像クリックでビョイーンと拡大するには？

画像をクリックすると、ビョイーンと拡大されるサイトを見かけたことはありませんか？
あれは『モーダルウィンドウ』といい、WordPressではプラグインを入れることで実装できます。
いろいろなモーダルウィンドウのプラグインがありますので、検索してみてください。

表示画像の大きさ

表示されている画像は自動で切り抜くかそのままかを選択することができます。

バラバラのサイズの画像でも自動で切り抜いてくれます。
注意点は見せたい部分が切れてしまう場合があるということです。

まとめ

いかがでしたか？
画像を並べる場合、ギャラリーを使用すると統一感のある表示を行え、しかもプラグインなしで使用できるのでオススメです！画像の大きさや枚数に気を付けながら配置しましょう！

以上で WordPressの使い方：ギャラリーの追加方法を終わります。
お疲れさまでした。

この記事を書いた人
最新の記事

小笹通典

1971年、奈良県橿原市生まれ。京都でWebを中心としたプロデュースなどを行うオフィスピコッツの代表。これまで多種多様なWEBサイトの制作や運営、プロデュースに携わり、複数のWEB系のコンテストなどでの受賞暦も持つ。現在、WEBサイトの作成や運営などはもちろん、新規事業立ち上げのサポートや各種プロジェクトのアドバイザー、大学校や高校の講師、PTA会長、CEOなど、活動の範囲を広げている。