WordPressの投稿ページや固定ページでビジュアルモードからテキストモードに切り替えた際、レイアウトが崩れることがあります。
これは、WordPressの自動整形が働いていることが原因です。
クライアントがページを編集するときなど、このありがた迷惑極まりない機能が邪魔になることがちょいちょいあるので、＜strong＞ビジュアルからテキストに切り替えてもタグを保持する方法を紹介します。
Advanced Editor Toolsを使う
対応方法は意外とシンプルでWordPressのプラグイン「Advanced Editor Tools (旧名 TinyMCE Advanced)」を使えば解決します。
LINK：Advanced Editor Tools (previously TinyMCE Advanced) ｜WordPress プラグイン
Advanced Editor Toolsはブログ投稿の文字の大きさ、色、背景などを拡張できるプラグイン。人気プラグインなので使ったことがある人も多いと思います。
ただし、入れるだけではダメで一か所設定を変える必要があります。
旧エディタ（Classic Editor）を使っている場合は「設定」→「Advanced Editor Tools」→「旧エディター (TinyMCE)タブ」の上級者向け設定にある「クラシックブロックとクラシックエディター内のパラグラフタグを保持」にチェックを入れます。
クラシックブロックとクラシックエディター内のパラグラフタグを保持
クラッシックエディターで＜p＞と＜br＞タグが除去されるのを停止し、テキストタブにこれらのタグを表示します。 テキストエディターの自動補完を停止し、より高度なコーディングが可能です。 しかし、まれに予想できない振る舞いをするため、常用前に充分テストを行ってください。 テキストエディター内での改行は出力に含まれます。このため空の行や HTML タグ内の改行、複数の＜br＞タグは使用しないでください。
これで基本的に崩れることはなくなりますが、機能説明にあるようにまれに予期せぬ動作をすることがあるので、テスト環境でしっかり確認してから使用しましょう。
