WordPress スペーサーブロックの使い方 行間・高さ余白調整

WordPress

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

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

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

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

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


 

(関連記事)ブロックエディターの使い方について

本記事では、のやり方に絞って説明していますが、エディターの使い方全体を勉強したい方は「【徹底解説】WordPressブロックエディターの使い方」を合わせてご参照ください。

 

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

WordPress スペーサーブロック
 

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

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

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

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

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

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

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

 

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

 

ブロックとブロックの間にスペーサーを入れる

ブロックとブロックの間にスペーサーを入れるには、段落と段落の間にあるプラスのボタンをクリックして追加することができます。

 

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

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

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

 

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

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


 

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

 

まとめ

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

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

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

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

 

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

 

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

個別指導形式のスクールでは、自分の知りたいことをピンポイントで学習・達成でき、自分で更新もできるというメリットもあります。
教室の無料事前相談もしておりますので、まずはお気軽にご登録ください。

詳細はこちら

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

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

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


 

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

自分でホームページ作成・Web集客したいホームページ作成スクール・教室 WEBST8

おすすめ記事3選

【WordPressの始め方総まとめ】ワードプレスブログの作り方9STEP

WordPressの始め方総まとめ

WordPress(ワードプレス)でブログを始めようと思った時に、サーバー・ドメインの手続きなどわからないことだらけで困っているというお悩みをお持ちの方も多いのではないでしょうか。本記事では、WordPressでブログやアフィリエイトを始めたい初心者を対象にWordPressの始め方をご紹介していきます。

【WordPressホームページの作り方総まとめ 12STEPで解説】

WordPressホームページの作り方

WordPressでホームページを自作しようと思った際に、「ドメイン?サーバー?たくさん調べることがあって何から手をつけたら良いのかわからない」というかたも多いのではないでしょうか。この記事ではWordPress初心者の方を対象にWordPressでホームページを作る方法をご紹介していきます。

【2020年版WordPress(ワードプレス)の使い方総まとめ】

今回は、これからWordPress(ワードプレス)を使ってホームページまたはブログサイトを作りたい初心者の方向けに、WordPressの導入から使い方までまとめて説明していきます。 (※)WordPress5.0から実装された最新のブロックエディター(グーテンベルグエディター)にも対応しています。

-WordPress
-,