【Word Press】 記事内で画像を横並びにさせる方法

Word Pressdブログ記事内で画像などを横並びにさせたいときは、どうすればいいの？

↑こんな感じのです

Word Press 超初心者の私でも、簡単にできそう！という事で使い方をまとめてみたいと思います。

因みに、ここではブロックエディタ（Gutenberg）を使用した方法です。

※実はこの機能について調べると、以前のクラッシックエディタと比較して、今回のブロックエディタ（ Gutenberg ）で大幅に使いやすくなった機能だそうです。

私は ブロックエディタ（ Gutenberg ） しか使用した事がありませんが、とっても簡単・便利に感じました。

「最近ブログを始めてみた！」という私のような Word Press 超初心者 の方のご参考になればと思います。

ブロックメニューの「カラム」を使う

「カラム」とは？

カラムとは「段組み」という意味で、web制作の場面でもよく使用されています。
例えば当ブログの場合、
①コンテンツの部分
②右のメニュー部分
の２カラムで構成されているという事になります。

構成する要素がいくつあるかが「～カラム」という事になります。

今回は
「ブログの記事内を２カラム・３カラムなどで構成し、画像を横並びに表示する方法」
をご紹介します。

ブロックメニューの「カラム」を使用

①「＋」でブロック一覧より「カラム」を選択します
　「カラム」がない場合は「すべて表示」させて選択するか、検索🔍で「カラム」と入力します。

③一番左のブロックを指定し、画像を入れてみます。

右側にある「ブロック」というメニューで、選択中のブロックのデザインを変更できます。
(段落ブロックの場合はフォントサイズやテキスト色・背景色などの変更ができます）

④１枚目の画像が左側に入りました。とっても簡単です。

画像やテキストなど様々選択できます

画像だけでなく

・テキスト
・メディアテキスト
・テーブル　

などブロック一覧にあるものの選択が可能です。

スマホでは縦並びに表示される

PCで見ると横並びに表示されますが、スマホだと左から右の順で縦並びに表示されます。

スマホは画面が小さい分、視認性が下がってしまうので、とてもありがたい動きです。
サイズも全て調整されて綺麗に表示されます。
ただ、文字入れなどのレイアウトはその点も考慮する必要があります。

横並びで表示させたい場合はテーブル（表）を使用すると解決されます。

画像の横並びは「カラム」で出来る。スマホの場合は縦並び

以上、Word Press・ブロックエディタ （Gutenberg） で画像を横並びに表示させる方法でした。
ブロックエディタを使用して直観的に使用することができ、とても簡単でした。

ただその際スマホでは画像が縦一列に配置されるため、その点を考慮しながら使用する事をオススメします。

画像を並べて横並びにして、見やすいブログのレイアウトに役立てみて下さい。