【スペーサーブロックの使い方】ブロック間・行間の余白の高さの設定

WordPressでページを作成する際にブロックとブロックの間が狭くて、もっとブロック間の余白・間隔をあけたいと思うことがあるのではないでしょうか。

WordPressでは、「スペーサー」というブロックが標準で用意されており、スペーサーブロックを利用することでブロック間の余白・間隔を調整することができます。

今回はWordPressブロックエディターの「スペーサーブロック」の使い方を説明していきます。

(※)本記事では、WordPress5.7、無料テーマLightningを利用した環境で説明しています。
 

ブロックエディターのスペーサーとは

スペーサーブロックとは、ブロックとブロックの間に余白の高さを設定することができるブロックです。

何もしなくてブロックとブロックの間に多少の余白がありますが、もっと高さの余白を設定したい場合があります。

段落ブロックを追加して少し余白を作ることもできますが、思ったように高さの調整ができません。

スペーサーブロックを追加すると高さをpx単位で調整することができます。
 

スペーサーブロックの使い方

ブロックとブロックの間にスペースを入れたい時は、スペーサーというブロックでスペースを追加できます。

余白を入れたい箇所でブロックの追加＞スペーサーを選択します。

 

スペーサーブロックが挿入されました。

 

スペーサーの高さを調節する

スペーサーの高さは、右側のブロックの設定メニューからpx単位で変更することができます。

あるいは、スペーサーの青い線を上下にドラックしてスペースを調節することができます。

 

追加したスペーサーを移動する

追加したスペーサーは、上下の矢印のアイコンで移動できます。

該当の箇所に直接スペーサーを入れにくい場合は、一旦スペーサーを任意の場所に作ってから、後から移動するとスムーズです。

まとめ

まとめです。今回はブロックとブロックの間にスペースを入れる「スペーサー」ブロックについて説明しました。

スペーサーブロックを使うと、高さをpx単位で調整できるのでとても便利です。

まだ少し慣れない部分もありますが、慣れていったらとても便利そうですね！

自分で触ってみないことにはなかなかわからないことも多いと思いますので、興味がある方はたくさん触ってみて覚えてください。

今回は以上になります。最後までご覧いただきありがとうございました。
 

「業者に任せたけど、更新ができない」「本で独学は時間がかかりすぎる・・」そんなお悩みの方も多いのではないでしょうか。

個別指導形式のスクールでは、自分の知りたいことをピンポイントで学習・達成でき、自分で更新もできるというメリットもあります。

教室の無料事前相談もしておりますので、まずはお気軽にご登録ください。

詳細はこちら

YouTubeチャンネル開設しました！

最大月間50万PVの当ブログをベースに、Youtube動画配信にてWordPress、ホームページ作成、ブログのことについてお役立ち情報を随時配信していきます。

ご興味ある方はぜひチャンネル登録をしていただけますと幸いです。

『自分で作る選択を』
自分でホームページ作成・Web集客したいホームページ作成スクール・教室