ブロックエディターのカラムの設定について。
この記事では、PC画面などでよく見かける、画像とテキストを並列に掲載する方法を解説します。
まずはこちらを御覧ください。
2カラムの実例
まずは2カラムの事例から。
![](https://kamisakuhideki.com/wp-content/uploads/2021/06/shaving-6256448_1920-1-1024x683.jpg)
剃り残しなし!なめらかな剃り味
ミントの香りでスッキリ!キャンペーン価格 298円
これも2カラム
これも2カラム
これも2カラム
これも2カラム
これも2カラム
これも2カラム
3カラムの実例
これは3カラム
これは3カラム
これは3カラム
これは3カラム
これは3カラム
これは3カラム
これは3カラム
これは3カラム
これは3カラム
![](https://kamisakuhideki.com/wp-content/uploads/2021/06/IMG_7635-1024x768.jpg)
![](https://kamisakuhideki.com/wp-content/uploads/2021/06/IMG_7634-1024x768.jpg)
![](https://kamisakuhideki.com/wp-content/uploads/2021/06/IMG_7633-1024x768.jpg)
ちなみに、スマホで見ると、すべてタテに並んで視認されます。
カラムの設定方法
実際の設定方法は、以下の通りです。
①ブロックの追加>カラム(Column)
![](https://kamisakuhideki.com/wp-content/uploads/2021/06/スクリーンショット-2021-06-15-11.26.33.png)
②パターンを選択
![](https://kamisakuhideki.com/wp-content/uploads/2021/06/スクリーンショット-2021-06-15-17.18.09.png)
③ブロッグを追加(ここでは50/50)を選択した場合)
![](https://kamisakuhideki.com/wp-content/uploads/2021/06/スクリーンショット-2021-06-15-17.19.19.png)
あとは、ここに通常通り、文章や見出し、画像などを入れるだけ。
💡今日のなるほど
自炊系の記事で、写真のタイルギャラリーは良く使っていたのですが、情報を並列に見せることで、読み手の利便性が向上しそうです。
ABOUT ME