知ってたら便利!スペーサーブロックで余白が自由自在

ひげ
ひげ

こんにちは、ひげ(@higepo_n)です!

先日、ワードプレスの「スペーサー」ブロックについて知りました。

それについてツイートしたところ、知らなかった・最近知ったというコメントをいくつかいただいたので、意外と知られていない機能かも?と思い、記事にまとめることにしました( ˘ω˘ )

ブログ記事の行と行の間(ブロックとブロックの間)に余白を作る方法の説明です。

※まず前提として、ブロックエディタを使用しています。

スペーサーブロック

パソコンでのスクショ&加工に慣れていないので全てスマホ画面です( ˘ω˘ )

ブロックを追加」から「スペーサー」を選びます。

こんなブロックが挿入されます。

この四角の部分が、余白となります。

最初に挿入した時はデフォルトで100pxの幅になっていますが、黒丸の部分をドラッグ&ドロップすることで幅を自由に変えることができます。

プレビュー画面で見るとこんな感じ↑で反映されます。

これで行間の余白が自由自在に操れます!( ˆoˆ )/

ちなみに、改行だけで段落を増やしても…

編集画面では余白ができているように見えますが、

実際には余白がありません。

黄色の部分に余白ができると思ったのに…( ´ – `)

わたし自身がずっとこの状況で、

「改行しても余白増えないな〜、まっいいか〜

と疑問を放置していました。

ただ、色々なブログで余白が効果的に使われているんですよね。

なので改めて調べてみたところ、この「スペーサー」機能を知りました。

もっと早く知りたかったよ!!o(`ω´ )o

(↑こちらもスペーサーで余白を作っています)

おまけの便利情報

ちなみに、投稿画面左上の「+」ブロック右端の「+」を押して「スペーサー」を探すだけでなく、

新しいブロックで「/(半角スラッシュ)space」と入力するとすぐにスペーサーブロックが選択できます。

この半角スラッシュでブロックを呼び出すやり方、有名なんですか…?

確かにブロックを追加するときに

文章を入力、または/でブロックを選択

ってありますもんね…でも全然気にしてなかったよ知らなかったよ…( ´ – `)

ワードプレスって奥が深い…。

(↑「/space」でスペーサーブロックを呼び出して余白を作ってみました)

もしかしたら誰かの有益情報になるかも?

わたしは基本的に自分のツイッターもブログも常に有益情報を発信することできていないと思っています。

でも、無益な情報でも、もしかしたらどこかの誰かにとっては「有益」になるかもしれない、そうだったらラッキーだな、というスタンスで発信をしています( ˘ω˘ )

今回の「スペーサー」機能についても、最初にツイートした時はきっとみんな既に知っていることなんだろうなと思っていたのですが、意外と知らない人も何名かいらっしゃったのです。

なんでもとりあえず発信してみたほうがいいかもしれないなと実感した出来事でした。

これからわたしもスペーサーを活用していきたいと思います٩( ‘ω’ )و

ひげ
ひげ

最後までお読みいただき、ありがとうございました!

コメント

タイトルとURLをコピーしました