ブロックエディタGutenbergでPタグを消されないもっともシンプルな方法。

WPのブロックエディタで、段落を挿入して、コードエディタに切り替えたことがある人は、見たことがあるはず。

コメントタグで囲まれた

<!-- wp:paragraph -->
<p>コメントタグで囲まれた</p>
<!-- /wp:paragraph -->

wp:paragraph の文字。
いちいちこんなマークで挟んでマメなのか何なのか・・・と過去には思っていたが、理由はあった。

ですよね。WPの痒い所に手が届かない感は、常に「改行まわり」「パラグラフまわり」にありましたよね。

Pタグやbrタグが自動で追加されるは消されるわ。

SectionタグをPタグで囲まれた日には泣きたい気分で、おまえもちったぁHTML5を理解してくれよ・・・と学問のススメに入りそうになりますよね。

開発者はときにゴリゴリのHTMLをドサッとコピペで投稿したいのですが、阻まれてきたわけです。WPエディタの自動整形という難物に。

で、どれほど検索したことでしょう。
WPエディタの自動整形によるPタグやbrタグの勝手な追加や、消去をコントロールする方法を。

多くのサイトではプラグイン「TinyMCE Advanced」を薦めていましたし、設定ファイルfunctions.phpに加筆するコードなども参考にさせていただきましたが

あらら?

<!-- wp:html -->
<p>パラグラフではなくHTML版もあるぢゃないの</p>
<!-- /wp:html -->

この簡素な2行・<!!!–wp:html–>開始と閉じ<!!!–/wp:html–>で挟むだけで、素のまま、生のまま(キのまま)のHTMLをマルッと書けます。

テキストエディタで整形したインデントもそっくり守られて、崩れることなく生かされます。

このコメントはブロックエディタをコードエディターモードに切り替えた時に見えるのですが、ビジュアルエディタでも簡単。

ビジュアルエディタで編集中に出ている黒「+」をクリックすると開くメニューから、カスタムHTMLを選ぶと、コードの中では

<!-- wp:html -->
このタグで挟まれた状態になっている
<!-- /wp:html -->

カスタムHTMLの入力画面はこんな感じですが
コードエディタに切り替えてしまった方が広々使えて楽。

で、最初からコードエディタが開くように使い慣れてるWPで、保存したカスタムHTMLだけのPOSTを、ビジュアルエディタにあえて切り替えて「見たところ」

ほんの一部ですが、インデントもそのまま表示されておびっくり。

ブロックエディタGutenbergは本当に使いやすいので、クライアントにも、そのまま何も気にしないでサクサク使って欲しいと思っていて、プラグインやfunctions.phpで基本のところを変えてしまうのはやや抵抗があったので、これはマジ嬉しい機能。