WordPressの記事にギャラリーを挿入する方法をまとめておきます。
ギャラリーブロックで挿入する
ブロックエディターのデフォルト機能です。
ギャラリーブロックの追加
記事編集画面でメディア「ギャラリー」ブロックを追加します。
アップロード及びメディアライブラリからギャラリーに表示させたい画像を追加します。
ギャラリーに追加したい画像を選択して、「ギャラリーを作成」をクリックします。
必要であれば、それぞれの画像に「代替テキスト」を設定して下さい（記事編集画面でも設定可能）。
ドラッグ＆ドロップで画像の順番を入れ替えて、「ギャラリーを挿入」をクリックします。
キャプションを入力しても構いませんが、入力した文字列は説明文として画像の上に重ねて表示されます。
問題がなければ、記事にギャラリーが挿入されます。
ギャラリーブロックの編集
ギャラリーブロックでは、カラム数や画像のリンク先を設定することができます。
レイアウトやカスタマイズできる項目はテーマによって異なるので、プレビューを見ながら設定して下さい。
| 詳細 | |
|---|---|
| カラム | 一列に表示させる画像の数（最大8） |
| 画像の切り抜き | アスペクト比（縦横比）の統一 |
| リンク先 | 画像のリンク先 |
| 新しいタブで開く | target="_blank"が追加される |
| 画像サイズ | 使用する画像のサイズ（小さなサイズ推奨） |
| 色 | ギャラリーブロックの背景色 |
| ギャラリーのキャプション | ギャラリーブロックの説明文 |
全て任意です。お好みで設定して下さい。
ギャラリー画像の編集
ギャラリー画像では、個々の画像の詳細設定を変更することができます。
| 詳細 | |
|---|---|
| スタイル | デザインの変更 |
| ALTテキスト（代替テキスト） | alt属性alt=""（SEO効果あり） |
| 画像サイズ | ギャラリー一覧で表示される画像の大きさ |
| キャプション | 画像の上に重ねて表示する説明文 |
既に代替テキストやキャプションが設定されている場合は、ギャラリー画像にもそのまま設定が反映されます。
基本的な設定方法は画像の挿入と同じなので、分からない方は下記の記事を参考にして下さい。
ショートコードで挿入する
記事編集画面で、ウィジェット「ショートコード」ブロックを追加します。
ショートコードブロックにギャラリーショートコードを挿入します（画像が複数ある場合は「,」で区切る）。
ショートコードには下記のオプションを追加することもできます。
デフォルトは、「サムネイルサイズ」「3カラム」「添付ファイルのページにリンク」が設定されています。
| 効果 | |
|---|---|
| columns="数字" | カラム数を変更（最大9） |
| link="file" | メディアファイルにリンク |
| link="none" | リンクなし |
| size="medium" | ミディアムサイズの画像を表示 |
| size="large" | 大サイズの画像を表示 |
| size="full" | フルサイズの画像を表示 |
| orderby="rand" | 画像の順番をランダムで表示 |
メディアファイルIDが分からない時は、メディアライブラリで音声ファイルを選択して、表示されたURLを確認して下さい。URLの「item=〇〇」「post=〇〇」に表示されている数字がメディアファイルIDです。
カスタマイズできる項目やデザインはブロックエディターのギャラリーと異なります。
また、テーマによってはレイアウトが崩れる可能性もあるので注意して下さい。
最後に
ギャラリーは、複数画像をまとめて表示させたい時に使うと便利です。
ショートコードで挿入することもできますが、基本的にはブロックエディターのギャラリーブロック推奨です。
コメント