Honmaru Manual

   

【エディタを使った記事の作成】エディタ上で段落を分ける方法と改行する方法

15 6月 15
北川 哲平

No Comments

WordPressでエディタを使って本文を入力する場合、Enterキーを押した時の挙動について注意が必要です。
Enterキーを押し方によって段落が分けられたり同じ段落内で改行が行なわれたりします。
ここではビジュアルエディタとテキストエディタでそれぞれEnterキーを押した時にどのような扱いになるのか解説します。
 
1.ビジュアルエディタの場合
2.テキストエディタの場合

 

 

ビジュアルエディタの場合

 
①ビジュアルエディタ上でテキストを入力し、その後で[Enter]キーを押してから続けてテキストを入力してみて下さい。
 
テキストを入力


②[Enter]キーを押す前の行と押した後の行間が結構開いているように見えます。
これはビジュアルエディタでは[Enter]キーを押すと段落が分けられるためです。
この記事を公開しホームページで表示しソースを確認すると次のように作成されていることが分かります。
 

<p>教えない、一緒にやらない、環境も整備しないから人が育つ。</p>
<p>何もしない状態を作れないなら、人は育たない。</p>

 
Enterキーを押すことでそれまで入力された文章が<p></p>で囲まれていることが分かります。そしてEnterキーの後で入力された文章は別の<p></p>の中に記述されています。
 
③次に[Shift]+[Enter]キーを押してから続けて文章を入力してみて下さい。
 
[Shift]+[Enter]


④今回はキーを押す前と押した後で行間が開いていません。
これはビジュアルエディタで[Shift]キーと[Enter]キーを同時に押すと改行が行なわれるためです。この記事を公開しホームページで表示しソースを確認すると次のように作成されていることが分かります。
 

<p>教えない、一緒にやらない、環境も整備しないから人が育つ。<br />
何もしない状態を作れないなら、人は育たない。</p>

 
[Shift]キーと[Enter]キーを同時に押すと、その場所に<br />が挿入されています。
 
このように段落を分けたい場合には[Enter]キーを、単に改行したい場合には[Shift]キーと[Enter]キーを同時に押して下さい。
 
なおいったん[Shift]+[Enter]キーで改行した後で次の行の先頭に戻り再び[Shift]+[Enter]キー押すと画面上は次のように表示されます。
 
[Shift]+[Enter]


この場合、改行が2回行なわれたように見えますが、この記事をホームページで表示しソースを確認すると次のようになっています。
 

<p>教えない、一緒にやらない、環境も整備しないから人が育つ。</p>
<p>何もしない状態を作れないなら、人は育たない。</p>

 
段落が分けられています。このようにビジュアルエディタでは[Shift]+[Enter]キーを押して改行をしたとしても、連続して2つ改行があると自動的に段落が分けられるようです。
 

 

 

テキストエディタの場合

 
①先程と同じようにテキストエディタ上でテキストを入力し、その後で[Enter]キーを押してから続けてテキストを入力してみて下さい。
 
テキストエディタの場合


②ビジュアルエディタの場合と違い、テキストエディタでは[Enter]キーを押すと改行が行なわれます。
この記事を公開しホームページで表示しソースを確認すると次のように表示されます。
 

<p>教えない、一緒にやらない、環境も整備しないから人が育つ。<br />
何もしない状態を作れないなら、人は育たない。</p>

 
[Enter]キーを押した場所に<br />が挿入されています。
 
ただしこちらはビジュアルエディタの場合と同じですが、2回[Enter]キーを押して連続して改行を行なうと段落が分けられます。
 
改行


③この記事を投稿しホームページで表示しソースを確認すると次のようになります。
 

<p>教えない、一緒にやらない、環境も整備しないから人が育つ。</p>
<p>何もしない状態を作れないなら、人は育たない。</p>

 
段落が分けられていることが確認できます。
 
このようにビジュアルエディタとテキストエディタでは[Enter]キーを押した時の挙動が異なります。
段落を分けたり改行したりするのは基本的な操作なので、それぞれのエディタで意図した通りの結果に出来るように使い方と挙動を覚えておいて下さい。