WordPress使いなら覚えておきたい!2種類の改行と使い分け方法

Sponsored Link


WordPressの改行方法には2種類あるって本当?

どうも、Linです。フラップ、マスターしました。

 

WordPress で記事を書いていると必ずライターの方がアクションがあります。

それは、

改行する

ということです。

改行なしで記事を書くというスタイルのブロガーの方もいると思いますが、基本的には読みやすさを優先して改行でスペースを空けていく手法が一般的となっています。

そんなWordPressブロガーにとって大事となってくる改行方法には、なんと、

2種類

存在しているのです。

  1. 段落分け改行(Enter)
  2. 段落内改行(Shift+Enter)

 

今日は WordPress 初心者のライターの方のために WordPress の改行方法というものを改めて分かりやすくまとめてみました。

 

WordPressの基本動作!段落分けの改行(Enter)

まず一つ目が

段落分けの改行

というものです。
Image from Gyazo
WordPress のビジュアル編集モードでEnterのみを押すと、この段落分けの改行ができます。

 

wordpress 改行

 

例えば、次のような文章があったとしましょう。

あああいいい

この時に、「あ」と「い」の切れ目で段落分け改行すると(つまりEnterをおす)、こんな感じになりますね↓

あああ

いいい

 

HTML 的に言うと、

というコードが、

になる改行ですね。

「あ」と「い」が同じ pタグに入っていましたが、段落分けの改行を切れ目ですることにより、改行の後には「い」のみ入っている p タグが新たに誕生することになります。

 

たまに使う!WordPressの段落内の改行(Shift+Enter)

続いて段落内で改行する方法です。

 

Image from Gyazo

これは WordPress のビジュアルエディターで、

シフト+エンターキーを押すと段落内の改行ができるようになっています。

 

wordpress 改行

 

例えば先ほどの例でいうと、「あ」と「い」の切れ目でシフトエンターを押すとこのようになります 。

あああ
いいい

 

HTML 的に言うと 改行の <br> タグが、 SHIFT +Enter キーを押したと箇所に挿入されるようになっていますね。

このような HTML コードが、

次のようになるでしょう↓

 

 

WordPress の改行方法の使い分けはどうするの?

ここまで2種類の WordPress の改行方法を見てきましたが、初心者の方が疑問に思うのが、

どうやって2種類の改行方法を使い分けたらいいんだよ?

ということでしょう。

 

実は答えはシンプルで、

だいたい1つ目の「段落分けの改行」を使えば良いです。

なぜなら、デザインの都合上、段落分けの改行した方が余白が適度で読みやすいようになるからです。

段落分け改行をすると、行と行の間にはpタグ同士の余白(margin+padding)が空きますが、段落内改行の場合、行間(line-height)が空きます。

wordpress 行間 調整

どのようなCSSコードを書くのかにもよりますが、

だいたい行間の方が狭い

ので、段落内の改行するとどうしても文字が詰まった印象になってしまうのであまりおすすめできません。

>>詳しくは「WordPressの行間・改行幅の調整方法」へ

 

「えっ、じゃあWordPressの段落内改行は存在意義あるの?」

と思っちゃうかもしれませんね。

いや、もちろんもちろん、万物に存在意義はあります。

 

このシフト+エンターの段落内改行の使い道としては、

引用の<blockquote>タグ内で文章を改行して見栄えを良くするため

に頻繁に使います。

例えば次のような文章を引用したとしましょう。

おっす!オラ悟空!

これではちょっと見づらいので、次のようにシフト+エンターキーで段落内改行してやると、

おっす!
オラ悟空!

このように綺麗に見せることができます。

 

もし、エンターキーの段落分け改行を使ってしまうと、新たに <blockquote>タグが生成されてしまうことになります↓

おっす!

オラ悟空!

これではちょっとえぐいと言うか、くどいですね。

こんな感じて、2種類のWordPressの改行方法を使い分けていきましょう。

 

それでは!

Lin

飯橋凛(Ihashi Lin)

インターネット広告代理店を1年半で退職。
その後、副業として活動していたウェブメディア運営のフリーランスへ。
現在はプログラミングの勉強に励み、0からフリーエンジニアの道を目指す。最近はキムチをまとめ買いにはまっている。


Sponsored Link

コメントはこちらからお願いします!



もう1本読んでみる