WordPress4.9ではTinyMCE Advancedで連続改行できなくなっている件

WordPressでよく言われるのが、「連続改行できないから嫌い」ってヤツ。

どうやら「br要素で1行空けるのは許さんぜよ!」ってのがWordPressの方針みたいなのですが、ぶっちゃけ日本語とは相性が良くないです。原稿用紙的に、好きなように間を取りたいですよね。

私も最初はこれがイヤで、でもそのうち慣れちゃって、別にいいかってなったんですけど、どうしても慣れないという方もいるわけで。

そんな時に便利なのが TinyMCE Advancedプラグイン。「段落タグを保持」というオプションがあります。

素のWordPressでは、ビジュアルエディタでEnterを入力すると段落が作成され、前後にマージンが表示されます。しかし、テキストエディタではp要素でのマークアップは行われておらず、マージンではなくて空行、つまり改行文字2個になっています。

テキストエディタで改行文字を連続して入力することもできるのですが、ビジュアルエディタに切り替えたときなどに、(WordPressから見ると)余分な改行文字を削除する処理が行われて、連続する改行文字は2個になります。

この改行文字2個をp要素に置き換えるのは、the_contentフィルターフックに登録されているwpautop関数です。出力時(表示時)に段落化を行うので、データベース上のテキストはマークアップされません。

TinyMCE Advancedで「段落タグを保持」をオンにすると、ビジュアルエディタでは特に変化はありませんが、テキストエディタ画面ではp要素とbr要素によるマークアップが行われます。データベースに保存されるのもマークアップ済みのテキストです。

これで、自動段落化の対象である改行文字2個は存在しなくなります。でも、テキストエディタからビジュアルエディタに切り替えたりすると、連続したbr要素(WordPress的には余分なbr要素)が削除されてしまいます。

なので、TinyMCE Advancedで「段落タグを保持」して、さらにthe_contentフィルターフックからwpautopを外してやると、br要素で連続改行できるようになります。めでたしめでたし。

‥‥なのですが、でもこれ、WordPress4.9以降だとうまくいかないようなのです。

まず、ビジュアルエディタでShift + Enterをいくつか続けて入力し、br要素による連続改行を行います。次に、テキストエディタに切り替えて、またビジュアルエディタに戻します。すると、改行が一つ消えます。

どうやら、テキストエディタからビジュアルエディタに戻す際に、 </p> の直前にある <br /> が削除されてしまうようなのです。切り替えるごとに一つ減っていき、最後には改行なしの状態になります。投稿を保存する際にも同様の現象が起こります(WordPress4.9.1 + TinyMCE Advanced4.6.7 で確認)。

対策としては、テキストエディタで </p> の直前に &nbsp; を入力して、 &nbsp;</p> とすればいいみたいなのですが、めんどくさい。

実は、TinyMCE Advancedの設定画面の「段落タグを保持」オプションには、

空の行や HTML タグ内の改行、複数の <br /> タグは使用しないでください。

って説明が書いてあります。今まであんまり気にしてなくて、これを書いてる途中で気付いたのですが、てことは、TinyMCE Advancedも本来は連続改行をサポートしていないのかもしれません。

でも、可能ならなんとかしたいなー。おち研様の記事でこんなのも見つけたのですが、

WordPressでプラグイン使わず連続改行させる素直な方法

自分のやりたいこととはちょっと違うんですよねー。WYSIWYGな連続改行というか、ビジュアルエディタで完結させたい。HTMLの知識がない人が記事を書く場合に、頭を使わせたくないのです。

hr要素でどうにかする、ってのも考えたんですけど、HTML5的には単なる水平線じゃなくて区切りって意味だから、それが連続するのはどうなのかという疑問もあったりしますし。

だったらクラス付きのp要素で、上下マージンなしの空段落にして1行空けるとか‥‥。うーん、それもなんかなー。

なにかうまい方法はないものでしょうかね。ビジュアルエディタを使いたいなら連続改行は諦めて、連続改行したいならテキストエディタだけ使う、ってするのが一番いいのは分かるんですけど。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です