inomady

【WordPress】固定ページのコードエディタでタグの自動追加、削除を防ぐ方法

最近、WordPressサイトの構築案件を受けた際、投稿エディタでタグが勝手に編集されてしまい、めちゃくちゃ詰まったので忘れないうちにその際とった解決法を書いておきます。

同じ箇所で詰まっている方の参考になれば幸いです。

固定ページのコードエディタでタグが勝手に追加、削除される事態が発生

WordPressのバージョンは「5.2.3」です。

ローカルのエディタ(Atom)で固定ページ用にコーディング

固定ページの投稿画面のコードエディタに上記コードをコピー&ペースト

と作業をし、「更新」や「下書きとして保存」などのボタンをクリックすると、エディタ上でpタグやbrタグが勝手に消えました。

また、更新した固定ページをブラウザで開いて検証モードでコードを調べてみると、新たに追加されているタグもありました。

どうやらWordPressの自動整形機能が原因らしい。

実際にこの自動整形機能を無効にし、タグが勝手に追加・削除されるトラブルを解決することができましたので、以下で手順を解説していきます。

1. プラグイン「Classic Editor」をインストール、有効化

まずは、「Classic Editor」というプラグインをインストールし、有効化します。

「Classic Editor」を有効化することで、使いづらいと評判のWordPress5.0以降のエディタ(Gutenberg)から以前のバージョンのエディタに戻すことができます

2. 固定ページの自動整形を無効化するコードを追加

「function.php」に以下のコードを追加します。

上記のコードにより、固定ページで「更新」や「下書き保存」などを押した際のタグ追加・削除を無効にすることができます。

しかしこれだけだど、コードエディタからビジュアルエディタに切り替えた際の自動整形を無効にすることができませんでした

ビジュアルエディタに切り替えなければトラブルは避けられますが、間違えて切り替えてしまったり、案件の納品後にクライアントが管理画面をいじることなどを考えると少々不安です。

そこで、固定ページでのみビジュアルエディタを無効化することにしました。

3. 固定ページのビジュアルエディタを無効化するコードを追加

「function.php」に、さらに以下のコードを追加します。

上記コードにより、固定ページの投稿画面でのみ、ビジュアルエディタへの切り替えを無効化することができました

まとめ:「Classic Editor」の導入を忘れずに行おう

固定ページのコードエディタで、タグの自動追加、削除を防ぐ方法は以下の通り。

  1. プラグイン「Classic Editor」を導入
  2. 固定ページの自動整形を無効化するコードを追加
  3. 固定ページのビジュアルエディタを無効化するコードを追加

上記の手順で、固定ページでの自動整形機能を完全に無効化することができます

僕は最初、手順2と3だけで対応しようとしたのですが、なかなか無効化することができずにめちゃくちゃ詰まりました。

結果、「Classic Editor」を導入したら簡単に無効化ができました

同じ箇所でつまずいている方は、ぜひ記事を参考にしてみてください。