この記事をおすすめしたい人
- WordPress REST APIの記事本文が自動成形されるのを無効にしたい人
- WordPressで記事本文や抜粋が自動成形されるのを無効にしたい人
- つまりオレ
今回はWordPress REST APIの記事本文が自動成形するのを防ぐ方法です。
最近REST APIの最適化にはまっているのでREST API用にしていますが、REST API以外でも使えるコードです。
最後にコピペ用コードを置いています。
記事の自動成形…?
これはたぶんピンとくる人と、全くこない人がいるでしょう。
WordPressにはHTMLを知らない人でも記事が書けるようにデフォルトで自動成形機能が有効になっています。
どういうことかというと、改行だけでつづられた文章にも勝手に<p>タグを追加してくれる機能です。
これはwpautopという関数で行われているようです。
wpautopの具体例
例えば新規記事を作製して、以下の内容で投稿します。
今日は雨が降りました。
明日は晴れですかぁ?
するとWordPressはこれをwpautopで変換して、実際のHTMLでは以下のように出力します。
<p>今日は雨が降りました。</p>
<p>明日は晴れですかぁ?</p>
空の改行を段落の途切れ目として<p>タグで区切ってくれるわけです。
これはHTMLを知らずにWordPressを始める人にとっては非常に大きなメリットでしょう。
wpautopの問題点
書き換えがあまりちゃんとしていません。 平気で無効なHTMLにも書き換えます。
僕はHTMLを書く際に、<div>や<section>の途切れ目を明示するために次のようなコードを書くことが多いです。
<div>
<p>
僕は雨も嫌いじゃないです。
</p>
<!-- div --></div>
これをWordPressが自動成形するとこう↓なります。
<div>
<p> 僕は雨も嫌いじゃないです。 </p>
<p><!-- div --></div>
<p>タグが追加されていますが、</p>がありません。
当然、HTMLの文法チェックをかけるとエラーが出ます。
1個だけ対応していないタグがあります
行目 127: <p> : タグが閉じていません
勝手に追加するならちゃんと閉じんかい!!
ちなみにこの問題。
コメントの位置を<div>タグの後ろにずらすと…
<div>
<p>
僕は雨も嫌いじゃないです。
</p>
</div><!-- div -->
文法的にエラーになるのは回避できます。
<div>
<p> 僕は雨も嫌いじゃないです。 </p>
</div>
<p><!-- div --></p>
無駄な<p><タグ打たれてますが、</p>があるのでエラーにはなりません。
両方とも元のHTMLはルール上問題がないのに、コメントの位置によって文法エラーになったりならなかったり。
これはWordPressのバグだと言っていいと思っています。
まぁ皆が好き放題に書いてるプレーンテキストもHTML文書も、両方を同じ関数で処理してるので、ものすごく大変なんだとは思うんですけども…。
正直なところ…
フヨウラ!!
自分でHTML書ける人にとっては邪魔にしかならない機能でしょう。
問題なのは、デフォルトではwpautopが有効になっている点です。 おそらくHTML書けない人が有効にするコードを書くよりは、HTML書ける人が無効にするコードを書く方が楽だと判断しているからでしょう。
WordPressの自動成形(wpautop)はオフにできます
オフにするだけならチョー簡単です。 以下のコードをfunctions.phpに追加するだけです。
remove_filter( 'the_content', 'wpautop' );
remove_filter( 'the_excerpt', 'wpautop' );
「the_content」の方は記事本文の自動成形をオフにします。 「the_excerpt」の方は記事抜粋の自動成形をオフにします。
「オフにするだけなら」とはどういう意味か
ほとんどのケースではオフにするだけで問題ないと思います。
ただ、サイト設計によっては、
- 特定の投稿タイプでだけ無効に
- 特定の著者のページでだけ無効に
- 特定のページでだけ無効に
という場合があると思います。
姉妹サイトのオレVIEW.comはライターが複数いるのでまさしくこのパターンです。
特定環境でだけ無効にしているとREST APIの「content」や「excerpt」の中身は自動成形されてしまいます。
REST APIの自動成形(wpautop)を無効にする
アクションフック「rest_api_init」の中でremove_filter()を実行するだけです。
add_action( 'rest_api_init', 'api_add_fields' );
function api_add_fields() {
remove_filter('the_content', 'wpautop');
remove_filter('the_excerpt', 'wpautop');
}
コールバックの「api_add_fields」はREST APIにカスタムフィールドを追加する記事のものを流用しているのであまり内容に則していません。 好きな名前に変えてください。
出力結果↓。
{
"id": 107,
"date": "2020-08-14T23:41:21",
"modified": "2020-08-15T13:11:43",
"slug": "test",
"title": "テストページ",
"content": "<div><p>僕は雨も嫌いじゃないです。</p><!-- div --></div>",
}
余計な<p>が入っていないので無事に無効にできました。
この方法はあくまで、「特定の環境でだけ自動成形をオフにしているせいで、REST APIでは自動成形が有効になってしまっている」ケースで必要なコードです。
それ以外のケース(ほとんどの場合)ではfunctions.phpに直置きするだけで問題ありません。
remove_filter( 'the_content', 'wpautop' );
remove_filter( 'the_excerpt', 'wpautop' );
コピペ用コードまとめ
WordPressで自動成形をオフにするには、次のコードをfunctions.phpに追加するだけです。 これでREST API含め、自動成形が無効になります。
remove_filter( 'the_content', 'wpautop' );
remove_filter( 'the_excerpt', 'wpautop' );
これはあらゆる状況で自動成形を無効にしてしまうコードなので、REST APIでだけ自動成形無効コードを追加したい場合は本文に戻ってください。
以上、WordPressからお届けしました!
WP REST APIカスタマイズ編の目次