018【WordPress】改行がうまくいかない方へ【Cocoon】

まずはわたしなりの結論から：

• 2行以上の改行は [Shift]+[Enter] でする
• [行の高さの数値] と [行の余白の数値] を同じにする

2行以上の改行は [Shift]+[Enter] でする

WordPressには2種類の改行があります。
（改行と段落と言い分けることもありますが、ここではどちらも改行とよぶことにします）


① [Shift]+[Enter] でする改行

これは文書作成ソフトなどにおける改行と同じです。
改行の数を増やせば、余白も増えます。


② [Enter] でする改行

これはWordPress独自の改行で、文と文のあいだに大きな余白ができます。
注意すべき点は、エディター画面で改行の数を増やしても実際のサイト画面では2行以上の改行は無効になってしまうという点です。

ぶどうとすいかのあいだの3行ぶんの余白が勝手に1行ぶんの余白に・・

これは、WordPressの自動整形機能だそうです（自動整形しないようカスタマイズする上級者もいるそう）。

————–

以上のことをふまえると、以下のことがわかります。

[行の高さの数値] と [行の余白の数値] を同じにする

↑は、Cocoonユーザーであるわたしがおすすめするカスタマイズです。
これをすることによって、

となり、改行方法にゆれが生じても見た目は同じになるのでストレスフリー！（と思っている）


なんでそうなるのか：

[行の高さ] を A 、 [行の余白] を B とした図をご覧ください。

この図からわかるのは、

• [Shift]+[Enter] でつくった1行ぶんの余白の幅 ＝ A（行の高さ）
• [Enter] でつくった1行ぶんの余白の幅 ＝ B（行の余白）

つまりAとBの数値が異なると、改行のしかたによって余白の幅が変動するということです。

わたしは変動するのがいやだったのでAとBの数値を同じにしました。

＊Cocoon設定の「本文」から値を指定できます。わたしは両方2にしています。

もちろん行の高さと行の余白の関係を理解したうえでそれぞれの数値を自分好みにカスタマイズするのはぜんぜんアリだと思います。




☆☆☆

以上、WordPressの改行のしかたについて解説してみましたが、いかがだったでしょうか。

どなたかのお役に立てればさいわいです！