WordPressで自動整形を部分的に無効化する方法

2019年8月31日2019年12月20日

WordPressのエディタは、pやbrなどの段落タグや改行タグを打たなくても、自動的に整形してくれます。

しかし、この自動整形機能がデザインの邪魔をしてくることもあり、直接HTMLタグを打ち込みたい場合などもあると思います。

回避策をググると様々な手法が見つかりましたが、「このパターンの場合は無理」という場合も多く、結果処理を自作することにしました。

既存の自動整形の回避方法も含めてご紹介します。

remove_filterでwpautopを削除する

てっとり早い方法として、テーマのfunctions.phpに、

remove_filter('the_content', 'wpautop');

と書いてしまうことです。

「wpautop」というフィルターが自動整形の役割を担っているため、そのフィルターを削除することで、完全に自動整形機能を消すことが出来ます。

しかし、すべての記事の自動整形が消えてしまうため、与える影響は極めて大きい。

そもそもWordPressの自動整形は本来、作業が減るありがたい機能。
一部のシーンだけ除外したい場合がある、というケースがほとんどだと思いますが、一部のシーンを重視して元々備わっていた機能を消してしまうのは逆に面倒です。

pタグとbrタグを除外する囲み型ショートコードを作る

囲み型ショートコードを定義して、自動整形により混入したpタグとbrタグを削除する、という方法もあります。

functions.phpに追記して、ショートコードを登録しましょう。

add_shortcode('notp', 'notp_delete_wpautop');
function notp_delete_wpautop($atts, $content = null){
    $content = str_replace(array('<p>', '</p>', '<br />'), '', $content);
    return $content;
}

これにより、[notp][/notp]で囲われた部分のpタグとbrタグを消すことが出来ます。

ただ、囲んだ中にpタグなどを書いていたとしても、問答無用で消されてしまいます。（classなどをつければ検索に引っかからないため回避はできます）

ソースコードをそのまま引用したい場合は、pタグやbrタグを書いた箇所に正しく動作させたい事情もあったりするので、使い方に気を付ける必要があります。

囲んだ箇所だけ自動整形前の状態に戻すフィルターを作る

今回、自作して提案したい手法です。

策1、策2の懸念を解消するために、

「一旦自動整形させて、指定した箇所だけ整形前に戻す」

というフィルターを作成しました。

functions.phpに下記のコードを追加します。

function exec_shortcode_escape_wpautop($content){
    global $post;
    if(!$post -> post_content){
        return $content;
    }
    $before_content = $post -> post_content;
    
    preg_match_all('/\[escp\](.*?)\[\/escp\]/s', $before_content, $aryMatchBefore);
    
    if(isset($aryMatchBefore[0]) && $aryMatchBefore[0]){
        preg_match_all('/\[escp\](.*?)\[\/escp\]/s', $content, $aryMatchAfter);
        foreach($aryMatchBefore[1] as $key => $value){
            $content = str_replace($aryMatchAfter[0][$key], $value, $content);
        }
    }

    return $content;
}
add_filter('the_content', 'exec_shortcode_escape_wpautop');

[escp][/escp]で囲われた範囲が、自動整形の影響を受けないエリアです。

[escp]というショートコードを追加する処理ではないのでご注意ください。

これにより、余計なタグが混入することもなく、pタグやbrタグは自由な位置で扱うことができます。

囲み型ショートコード内の自動改行対策にもなる

なお、この処理は「自動整形」と「ショートコードの実行」の間に挿入されるため、[escp][/escp]内でショートコードを入れてもしっかり実行されます。

フィルター	処理	優先度
wpautop	自動整形	10
exec_shortcode_escape_wpautop （挿入）	[escp]で囲った場所を、wpautopによる変更前に戻す	10
do_shortcode	ショートコードを実行	11