WordPressのエディタには自動整形機能があります。 改行を入れると自動的に<BR>タグを挿入して表示してくれる機能ですね。 そのため、以下のような問題が発生します
| (1) | 連続改行が無視される。(連続して改行を入れても１行分しか開かない) |
| (2) | コードを見やすく整形するためのスペース・インデントが一切効かない。 |
| (3) | スクリプトの途中に改行タグ<BR>が入り込む事で、スクリプトが作動しなくなる。 |
| (4) | 改行タグ自動補完機能がないブログからの記事をインポートした時に、表示が崩れてしまう |
この機能についてちゃんと理解していれば、使いこなす事は難しくはないと思いますが、この機能の一番の問題点は、この機能をオフにできない事、ですね。
上に挙げた問題点の(1)に関しては、HTMLの本来の解釈としてはある意味正しいと言えます。本来、改行を連続することでスペースを調整するのは、使い方としては間違っているわけですね。 ※一行開ける時は段落が変更されたと言う解釈で<P>タグで囲う。段落間の離隔は<P>タグのマージンで調整する。 （このようにすることで、デバイスの幅が変わっても変なところで改行が入らないレスポンシブデザインにすることができます。） (2)スクリプトのコードなどを記事内に表示させようとしたときに、スペースやタブによるインデントがすべて無視されてしまうので、見やすく整形表示できませんが、これは、コード表示したい領域にwhite-spaceを指定してやることで解決できます。 (3)は、Stylesheet、Javascriptなどで、改行を入れて見やすく整形してしまうと、その改行部分に全部<br>が入り込んでしまう事になるので、スクリプトが作動しなくなってしまいます。 （Google Adsenseのコードなどをそのまま貼り付けた場合に、この機能のせいで作動しなくなってしまうというのはよくあるトラブルのようですね。） これは、コードの改行を全て削除して、一行になるようにして貼り付ければ作動するようになります。 （見難いですが、仕方ありません。外部のエディターで編集して、最後の改行を全て削除してからコピペればOKですね。） テーブルなども、見やすいように改行を入れていると変に間延びした冗長な表になってしまいますが、改行を全て削除すればOKです。 (4)記事に一切改行が反映されず、改行したい場所で改行タグを入れる形式の記事ならば、WordPressにインポートする前にすべて改行を削除してやれば済みます。（改行が反映されるタイプのブログなら、そのままインポートすればOKですね。） しかし問題は、改行が反映されるかどうかを記事ごとに切り替えられるタイプのブログ。（FC2やSEESAAでは改行タグ挿入機能を記事ごとに選択的にON/OFFできます。）このようなブログからエクスポートしたデータの中は、改行タグ<br>が入ってる記事と入ってない記事が混在している状態になっているわけです。 これをそのままインポートすると、改行タグが入った記事だけ、変に行間が間延びしたような表示になってしまいます。これを避けるためには、インポートの際に、記事ごとに形式をあわせてやる必要があります。まぁインポート作業は頻繁に行う事はないでしょうから、最初にがんばって整形してやるしかないかも知れません。。。
連続改行が一つに省略されてしまう問題は、意外と簡単に解決できます。改行の前にスペースを一つでも入れてやれば、WordPressは連続改行とは判断しないので、連続改行がそのまま表示されたようになります。(スペースを入れるのが気持ち悪いと言う人は嫌かもしれませんが。） また、連続改行をそのまま表示してくれるプラグインもあります。
以前は｢PS Disable Auto Formatting｣というプラグインが定番だったようですが、最新版のWPに入れると不具合が出るので使えないらしいです。 ☆改行制御の定番プラグインは、現在はこちらみたいですね。 ⇒｢brBRbr｣(http://camcam.info/wordpress/101)
しかし、上記の、特に(3)の問題は、WordPressのエディタ上で記事を書くに当たっては、とてもやっかいな問題になります。 いちいち外部エディタで作業して、最後に改行を全削除するというのも、毎度毎度だと段々イライラしてきます。 やはり、自動整形機能をオフにしたい。 記事ごとに切り替えられればそればベストですが、それは難しいので、常時ONか常時OFFかであれば、常時OFFのほうが使いやすいと思います。 ※常時OFFでスペースや改行をそのまま表示したい場合は、White-spaceを指定してやれば良いだけですので。
「White-space」の詳しい使い方についてはこちら
検索してみたところ、この自動改行機能を削除するのは意外と簡単なようです。div.tbltst{border:solid 1px silver; max-width:500px;width:100%;height:125px;overflow:hidden;background:white;} div.thumimg{float:left;border:none;width:125px;height:125px;overflow:hidden;} div.ttlsa{color:black;overflow:hidden; height:125px; padding:5px;} img.thmc{width:285px;position:relative;max-width:none;}
WordPressの自動整形（ビジュアルエディタ含む）を無効にする方法 - Qiita
WordPressで既存サイトのテーマ化などを行った際、胃が痛いのがWordPressの自動整形の問題だと思う。これはWordPress内部に定義されている `wpautop` という関数が行っている処理なのだけど、この関数が結構...
詳しくはリンク先を見て頂けばと思いますが、覚書として以下にやり方をメモ
「functions.php」に以下のコードを追記
remove_filter( 'the_content', 'wpautop' );
remove_filter( 'the_content', 'wptexturize' );
さらに、ビジュアルエディタの整形機能を削除するには、下記のコードを追記
function override_mce_options( $init_array ) {
global $allowedposttags;
$init_array['valid_elements'] = '*[*]';
$init_array['extended_valid_elements'] = '*[*]';
$init_array['valid_children'] = '+a[' . implode( '|', array_keys( $allowedposttags ) ) . ']';
$init_array['indent'] = true;
$init_array['wpautop'] = false;
$init_array['force_p_newlines'] = false;
return $init_array;
}
add_filter( 'tiny_mce_before_init', 'override_mce_options' );
※↑これを設定した後でも、上記の｢brBRbr｣などのプラグインを有効にすれば、自動整形機能は普通に働くようです。
コメント