Gutenbergで普通の改行をする方法:HTMLでの記述の仕方

WordPress

今回は、WordPressの標準エディタであるGutenbergを使って普通の改行をする方法を紹介します。

通常のテキストエディタでは、Enterキーで改行が出来るが、Gutenbergでは段落ブロックが作成され文章の下に空白が出来てしまいます。これを普通の改行にして空白が出来ないようにする方法です。

方法は、段落ブロックを使っての方法、整形文を使った方法、HTMLでの記述と3つあります。それらを細かく説明していきます。

段落ブロックでの改行

これは段落です。
この様に段落でも普通の改行が可能です。
ただEnterキーを押すと段落ができて空白が出来てしますます。
ではどの様にして段落ブロックで改行しているのでしょうか?

上記のように段落で改行したいのなら下記のキー入力で可能です。

ショートカットキー Shift +Enter で段落ブロック内で改行ができます。

WordPressの場合、この方法で改行していくのが最もおすすめです。

整形文を使う

これは整形文です。
整形文では、打ち込んだままの表示がされますので改行も改行として表示されます。
またこの様に      空白もそのまま表示されます。

整形文は下記写真のブロック選択でフォーマット整形済みから展開できます。

HTMLで改行の指示を出す

HTMLで直接改行の指示を出す場合は改行したい文章の間に<br>と入れるだけです。

<p>テキスト<br>テキストテキスト<br>テキスト<br>テキストテキスト</p>

下記が、上記のHTMLの実際の見た目。

テキスト
テキストテキスト
テキスト
テキストテキスト


以上が「Gutenbergで普通の改行をする方法:HTMLでの記述の仕方」でした。

他にも段落ブロックにCSSでmarginの指定を0にすれば可能だが、段落の空白も使う事で綺麗なレイアウトになるので今回紹介した方法で改行を行い、段落は段落で使っていくのをおすすめします。

下記の記事では基本的なGutenbergの使い方をまとめています。合わせてどうぞ。

2020年3月16日WordPressGutenberg,WEB,WP

Posted by KT