WordPressの編集画面で3回改行しても、記事を公開すると2回改行、要するに2行空白の行を作ったはずなのに、1行空白の行に強制的に変更されます。
2行以上の空白行を作る方法を解説します。
WordPress編集画面で2行空けて改行しても記事では1行空きの改行になる問題
上の画面は、WordPressの編集画面ですが、一番したの「あ」は、2行が空白行になるよう改行しています。
ところが、実際の記事には、1行空いた改行に自動変換されています。
これは、WordPressが強制的に2行以上の空白行を作らないようにしているためです。
スポンサーリンク
空白行を2行以上作る改行方法
空白行を2行以上作るには、簡単なコードを追加することで実現できます。
2行の空白行を作りたい場合
下記の2行空白行を入れる場合の入力方法を解説します。
1行目
(空白行)
(空白行)
2行目
2行の空白行を入れたい場合の記述方法
WordPressの編集画面に、下記を入力することによって、2行の空白行を作ることが可能です。
1行目
<p style=”padding-top:1.9em;”>2行目</p>
この記述の意味
「<p style=”padding-top:1.9em;”>2行目</p>」という記述は、各々下記の意味となります。
<p>
<P>から</P>の間にある文章が、ひとつの段落を意味します。
style=”padding-top
<P>に「style=”padding-top」と付けると、「この段落の前に○○文字分の空きを作りなさい」という指示です。
1.9em
em(エム)は、「1文字分の高さ」を意味します。
1.0em = 1文字分の高さ
「1文字分の高さ」であるため、「1行」と同じ意味になります。
<P style=”padding-top:1.9em;”
上記は「1.9文字分の空きを作りなさい」となります。
なお、本来なら「padding-top:2.0em」(行の前に2文字分の空きを作りなさい)が正しいのですが、僕のブログ記事で「2行空ける」と指定するには、「1.9em」がぴったりでした。
みなさんは基本的に「padding-top:2.0em」の指定で良いと思います。
好みによって、emの数値を小さくして上の行との間隔を狭めたり、逆にemの数値を大きくして上の行との間隔を広くすると良いでしょう。
実際に2行の空白行を開けた例
下記の通り、記事では綺麗に2行の空白行ができます。
編集画面上での記述
1行目
<p style=”padding-top:1.9em;”>2行目</p>
実際の記事での表示
1行目
2行目
(まとめ)空白行は無理やり作らずHTML文やCSSで調整しましょう
空白行を作る手段として、半角スペースを入れるといった方法も考えられますが、Googleが半角文字だけの行を読み取った時に、何の意味を示す行であるか判別付かないと思います。
従って、空白行を入れたいなら、今回ご紹介したHTML文で空白行を入れるか、予めCSSで行間を広く設定する等、Googleにも解釈できる方法で行間を調整しましょう。