ビジュアルエディタで改行する方法

WordPressのビジュアルエディタで、うまく改行できないとお困りではありませんか？その理由(WordPressの改行の仕様)と解決方法について紹介します。

WordPressの改行

WordPressの記事編集方法には、ビジュアルエディタとテキストエディタとがあります。

文書作成ソフトやメールソフトなど、キーボードによる入力時の改行は、[Enter](Mac OS Xの場合は[return])キーを一度押すと実行されるのが一般的ですよね。WordPressの場合、テキストエディタでの改行はこの方法で良いのですが、ビジュアルエディタではうまく改行できません。なぜでしょうか？

ビジュアルエディタでの改行

ビジュアルエディタで編集中に、改行したい場所で[Enter(return)]キーを一度押すと、

その前後で空白ができてしまいます。

実際のサイトの画面でも、空白が表示されてしまっています(下の画像は、テーマ「Twenty Fifteen」の例)。

空白ができる理由

このように空白ができてしまう理由は、[Enter(return)]キーを押した場所の前後で2つの段落に分けられてしまうからです。

さらにくわしく言うと、上図の段落①・②それぞれにHTMLのpタグが自動挿入されるからというのが空白ができる理由です。今回の例では、次のようなHTMLコードになります。

<p>WordPressのビジュアルエディタでうまく改行ができなくて困っています。いったい、どうすればうまく改行できるのでしょうか？</p>
<p>ふつう、改行といえばEnterキーを押すだけでいいと思いがちですが、ビジュアルエディタではそういう訳にはいかないようです。</p>

HTMLのpタグとは HTMLでは、<p>～</p>で囲まれた部分は1つの段落(パラグラフ【paragraph】)として扱われます。段落の間隔は、CSS(スタイルシート)で指定されていることが多いため、使用するテーマによって距離が異なります。

ビジュアルエディタで改行させる方法

ビジュアルエディタで、段落分けすることなく改行させるには[Shift + Enter(return)]キーを押してください。