WordPressで改行が反映されない場合のオススメプラグイン!

PS Disable Auto Formatting

WordPressを使ってブログを書いていると、『どうして書いた通りに改行が反映されないんだ!』
とイライラすることもあるのではないでしょうか。実際に僕も、ビジュアルエディタとテキストエディタを切り替えた時に、トレンドアフィリエイト用サイトにYouTube動画を貼り付けた時など、

なぜかHTMLが勝手に変更されていたりして非常に不快な思いをした経験があります。

そんな、改行が反映されず記事の見た目が綺麗にならないという悩みを解消するためにオススメのプラグインが、

『PS Disable Auto Formating』です。こちらのプラグインをいれることで、

ビジュアルエディタとテキストエディタを切り替えた時でも、

HTMLコードが勝手に変わらなくなるため、思い通りに改行できるようになります。

WordPressの改行が消える問題を解決するプラグイン「TinyMCE Advanced」

努力が水の泡

WordPressは標準仕様のままだと、記事の中で改行やスペースを連続で入れる事が出来ないんですよ。

 

でも日々ブログを書いていたら、改行を繰り返してスペースを広く取ったりしたくなるじゃないですか。

行間の詰まった文章は読みづらいですし。読みづらい記事は読者の読む気を削いでしまいますから。

 

そんな、改行やスペースを連続で入れる事が出来ない問題を解決する一番簡単な方法が、
プラグイン「TinyMCE Advanced」のインストールです。

自動整形機能が余計なお世話

WordPressは記事投稿画面で執筆された文章を自動的に適切なHTMLタグで整形して保存・投稿する機能を持っています。

 

自動整形機能と言われていますけど、この機能のおかげで特にHTMLに詳しくない人でも整った文章をブログ記事として投稿することが出来るんですね。

 

基本的にはとても便利な機能であるはずの自動整形機能なんですが、この機能が文章構造、HTML的に「正しい」体裁に整えようとするため

  • 2回以上続く改行は1回にまとめる
  • 行頭、行末のスペースは削除する

といった処理をしてしまうおかげで、入れたはずの改行やスペースなどが勝手に削られてしまい、元々作っていた記事のレイアウトを崩してしまうことがあるんです。

 

こういうのを「ありがた迷惑」とか「余計なお世話」とかいいますよね。

 

ちなみに内部的な話をすると、この自動整形処理はwpautopという関数が担っていて

  • 改行は<br />タグに変換
  • 段落には<p>タグを適用
  • 改行<br />が2回続いたら段落<p>に変換
  • 2回以上続く段落<p>は1回にまとめる
  • 行頭、行末のスペースは削除する

といった処理を行っています。

 

このありがた迷惑な「自動整形機能」をどうにかもっと使いやすい仕様にしたい。

改行やスペースを繰り返したい。

記事のレイアウトを勝手に変えてほしくない。

 

そんな悩みを解決する一番簡単で手っ取り早くて確実な方法。

それが「TinyMCE Advanced」というプラグインをインストールする方法です。

TinyMCE Advancedで自動整形処理を制御する

TinyMCEadvanced検索

TinyMCE AdvancedはWordPressの投稿画面であるビジュアルエディタの機能を拡張するプラグインです。

 

とても高機能で、ビジュアルエディタを使って記事を投稿するならインストール必須レベルのド定番プラグインなのですが、実はこのTinyMCE Advancedが自動整形処理をいい感じに制御してくれる機能を持っているんです。

しかもその使い方がとても簡単。

 

TinyMCE Advancedの設定画面の下の「高度なオプション」という項目にある
段落タグの保持
のチェックをオンにするだけです。

TinyMCEadvanced高度なオプション

たったこれだけで、自動整形処理をいい感じに制御して、改行やスペースを自由に入れることが出来、勝手にレイアウトを崩すようなことをしなくなります。

 

※プラグインのインストール方法については
WordPressプラグインのインストール方法
を参考にしてください

ちなみに、改行の注意点

TinyMCE Advancedの「高度なオプション」をオンにするだけで改行を自由に何回でも出来るようになる訳ですが、細かい話をすると、複数回改行を重ねられるのは「段落」を示す<p>タグに限ります。

 

WordPressのビジュアルエディタ上での操作で言えば
Enterキーを押して改行を重ねることが出来るようになる。
ということです。

 

※※※※※※※※※※

以下はHTMLの話になります。知らなくても全く問題ないですが興味ある人は読んでください。

 

正確に言うと、HTML的には2種類の改行があります。

  • <p>~</p>タグで囲んで文章の塊であることを示す「段落」
  • 文章の塊の中で「改行」を行う<br />タグ

 

WordPressでも当然

  • Enterキー:段落(<p>~</p>タグで囲む)
  • Shift+Enterキー:改行(<br />タグ)

と区別して扱えます。

 

このうち<br />タグを打つ改行は、WordPress標準の動作と変わらず、何度<br />タグを重ねても(Shift+Enterキーを連打しても)保存すると1つの<p>タグに置き換わって1つの段落にまとまってしまいます。

 

一方のEnterキーで<p>~</p>タグを挿入する「段落」が、繰り返しただけ改行することができます。
HTMLコード的には
<p>&nbsp;</p>
という空白(ノンブレイクスペース)を持った段落を重ねて改行を表現しています。

ビジュアルエディタ テキストエディタ 投稿 ソースコード
 改行サンプル-ビジュアルエディタ 改行サンプル-テキストエディタ 改行サンプル-投稿  改行サンプル-ソースコード
上の改行は
Shift+Enterで挿入
下の改行は
Enterで挿入
上の改行は<br />タグ
下の改行は
<p>&nbsp;</p>
で表現されている
投稿すると上の改行が削られてしまったのが観察できる  <br />タグが<p>タグ1つに置き換えられて改行が削られたことがわかる

TinyMCE Advanced「段落タグの保持」をオン。
それだけ。

解説すると長くなってしまいましたが、要は

TinyMCE Advanced「段落タグの保持」をオン。

これだけで改行が消える問題はすっきり解決です。

ニッシーの運営ブログ

初心者にやさしいアフィリエイト講座
http://www.xn--1-nfud2bza2ad0c.xyz/tokyo/
超初心者のための情報商材レビューサイト
http://review2020.xn--1-nfud2bza2ad0c.xyz/
ネットビジネスで自由人に!
http://sibaryou555.blog.fc2.com/
フェイスブック
https://www.facebook.com/nishimura.susumu
Twitter
https://twitter.com/sibaryou0224?lang=ja
メール
sibaryou3@gmail.com

ベスト寝具
http://bestsleep.ocnk.net/

 

皆さん、稼いでいますか?

私が、アフィリエイトを始めたころに、苦労したことなど、

これからアフィリエイトまたは、物販、YouTubeを始めようと

いう、初心者に、アドバイスできることがあれば、伝えていきたいと思い

このブログも立ち上げました。

優秀な超アフィリエイターさんは、いっぱいいます。

いきなりむつかしいノーハウを学ぶのは大変ですよね。

一緒に、成長していけたらいいですね。

特典

情報商材アフィリエイトで稼ぐ方法

情報商材アフィリエイトは実績がないとできない

そう思われている方も多いようですが、これは完全にウソです。

あなたは、初めて訪問したブログで、管理人の実績を確認しますか。

私は、「記事が面白いか」「コンテンツが充実しているか」をみます。

トップアフィリエイターのブログは、すべて実績を載せているか。

そんなことはありません。

逆に「俺は稼いでるぜ」「私は稼いでいる」だけを強調しただけでは、感じが悪いと反感を買うこともあり、

マイナスに働く可能性もあります。

アフィリエイトを紹介しているサイトは

確かに多いけど、そこの管理人の人ってそんなに

稼いでいるものなのかな…と……^^;

そもそも作者自身も、そんなに稼いでいるようには、

思えない部分もあったりするんですね。

「今のご時世、これだけじゃね…」というのが僕の感想でもあり

今の情報商材アフィリ市場や紹介している人サイトなどを見れば

「内容の物足りなさ」つまり、大きな成果に直結するとは思えないんですよね^^;

確かに基本操作など役立つと言いますか

価値が全くないとは言わないけど、ここまでの内容だと

恐らく伸びないだろうな~と言う部分が多数ある。

むしろ今の情報アフィリ業界を見れば

それも一目瞭然なわけです。

情報商材アフィリエイトの代名詞のようになっているけど、どうなのかな?と思える部分は、

多々ありますね^^;

無料メルマガ
お名前(姓)
メールアドレス(必須)
 
Powered by メール配信システム オレンジメール
スポンサーリンク




この記事が気に入ったら
フォローしよう

最新情報をお届けします

Twitterでフォローしよう

おすすめの記事