(仮)Rocket-Field

いろいろ書けばその内に方向性が見えてくるよね

WordPress初心者に向ける改行(連続改行)の方法

      2014/04/01

PPH_tetuseinotanku500

WordPressを初めて使う人にとっては改行することだけでもつまづいてしまうことがあります。
なぜならMicrosoftWordを使うようには改行できないからです。

ブログを書くにあたり、改行は読みやすくするために非常によく使います。
人によっては改行を連続で使用し、広く空け読みやすくもしくは次の文章を期待させるような手法をとる人もいます。

そんなときに、つまづいてしまう改行の仕方、行間の空け方についてまとめます。

WordPressでの改行の方法

まず、WordPressでEnterキーによる改行を試みます。

ビジュアルエディタ

ビジュアルエディタで以下のような2つの文をEnterキーで改行するように試みます。

2014-04-01_11h35_35

すると以下のように段落が分けられてしまいます。
このように単純にEnterキーを押しても改行ではなく段落分けが実行されます。

<p>○月○日晴れ</p>
<p>今日は駅前のスーパーで買い物をしました。</p>

では、改行はどのようにやるのか。

Shiftキー+Enterキーです。
以下、上記の文を今度はShiftキー+Enterキーで改行してみます。

2014-04-01_11h37_27

<p>○月○日晴れ<br>
今日は駅前のスーパーで買い物をしました。</p>

このように改行ができます。

テキストエディタ

テキストエディタでは改行する場合は以下のようにEnterキーでできます。

2014-04-01_11h39_35

<p>○月○日晴れ<br>
今日は駅前のスーパーで買い物をしました。</p>

連続改行してみる

ビジュアルエディタ、テキストエディタそれぞれ連続改行するとどうなるでしょうか。

すると以下のように段落分けが実行されます。
※以下はビジュアルエディタの場合です。テキストエディタも同様の結果となります。

2014-04-01_11h50_47

<p>○月○日晴れ</p>
<p>今日は駅前のスーパーで買い物をしました。</p>

このようにWordPressでは連続改行はできません。

連続改行ではなくCSSでmarginを変更する

連続改行をしたいのはなぜでしょうか。

たぶんそれは行間を空けて表記したいからではないでしょうか。

それならば連続改行はせず、CSSでmarginを変更するようにしましょう。

<p style="margin-bottom: 4em;">○月○日晴れ</p>
<p>今日は駅前のスーパーで買い物をしました。</p>

このようにすると以下のように行間が4em空きます。

2014-04-01_12h03_13

まとめ

WordPressでの改行の仕方はエディタによって変わってきます。

また、連続で改行をして行間を空けるということができないため、他の方法が必要となってきます。
今回はCSSでmarginを変更する方法を紹介しましたが、他にも以下のような方法があります。

  • プラグインを使う
  • &nbsp;を使う

ただし、上記2つの方法を使うよりもCSSで設定した方が早いし分かりやすいと思います。
どうしてもCSSは嫌という場合は下記URLを参考にしてみてください。

参考サイト
≫WordPressで連続改行をさせる3つの方法 | Syumart
≫WordPressで連続改行させる方法まとめ|みんなの扉を開くカギ


おすすめ

1
スマホで暇つぶしするならdTVがおすすめ。移動時間も有意義に

暇つぶしといえばスマホ。 最近は、電車での移動時もスマホをいじっている人を多く見 ...

 - WordPress