記事投稿時のpタグを制御する

2021 1/01

2021.01.01

記事投稿時にテキストエディタでpタグ、brタグが消える。エディタータブを切り替えることで表示が崩れてブログ書く気が無くなってしまいます。

pタグが消えるWordpressの機能を制御してブログを書きやすくする事ができます。

Wordpressの元々の機能で、記事投稿時に自動でpタグを入れてくれます。

この機能がある事で初心者や、テーマの機能だけでブログ更新をされている方は気にならないと思いますが、少しhtmlやCSS、PHPが書ける方は、カスタマイズした時に表示が崩れたり、意図通りに上手く動かない現象がでてきます。

brタグも自動で制御されますが、個人的には「enter」でbrタグ改行が使えるのは便利で、カスタマイズにはあまり影響されないと思いますので、pタグだけを制御したいと思います。

ググれば解決方法が多く出てきますので、実践的な使い方をご紹介します。

解決方法について

単純にpタグを削除するだけでしたら、functions.phpに１行書けば対応する事もできますが、既にいくつも記事を作られている場合は、自動でpタグが付いた状態で記事が投稿されているので、pタグをトル処理をしてしまうと、過去の全ての記事が崩れてしまいます。

ここでは以下の内容で対応方法を紹介します。

既に記事が多く過去に作ったものには影響を与えたくない
意図した部分だけpタグをトリたい

プラグイン等で一発解決

一定範囲（意図した部分）だけに対応する事を考えたときに、ページ単位、記事単位であれば、プラグインだけで自動出力されるpタグを解決する方法があります。
別記事で紹介しておりますので、簡単に解決したい方はこちらをご覧ください。

あわせて読むと効果的な記事

【絶対解決】記事投稿時にテキストエディタでpタグ、brタグが消える

ワードプレスでブログを書いていると、何かの拍子にpタグやbrタグがwysiwygの投稿画面から消えますよね。。。自分で確認はしていないのです…

phpで独自にソースを追加

プラグインでも解決できますが、プラグインを極力使わない方が無難だと思います。
その理由は、、、

プラグインの更新が無くなってしまう
テーマやWordpressのコアアップデートで動かなくなる
サイト表示が重くなる

上記の様なリスクが多く考えられるためです。

WordPressはソースの改修が簡単にできます。
以下のソースをfunctions.phpに追加してください。

//ショートコードで囲んだ範囲のpタグを消す
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');

上記のソースの10行目、13行目の青ライン部分で[escp]と言うタグ名の変更もできます。

これで[escp][/escp]のタグで挟んだ範囲で自動でpタグは出力しない。と言う形で処理されます。
ただし、手書きで書かれたpタグは活きになります。

functions.phpのファイルは記載を間違えると、サイトが表示しなくなったり壊れてしまうので、バックアップを取るなどご注意の上ご対応ください。また、使わてれいるテーマやWorpressコアファイル次第で上手く動かない場合も考えられますので、ご自身の判断でお願いいたします。

後日記載する時に書き方を忘れない為に

プラグインの「AddQuicktag」を入れる事で、記事記入時のクイックタグにオリジナルのボタンが設置できます。
クイックタグボタンも簡単にfunctions.phpに記入する事で変更できますので、pタグの制御と同様に極力プラグインは使わないで対応する事をおススメします。

function add_my_quicktag() {
    ?>
    <script type="text/javascript">
    　QTags.addButton('escp','ESCP','【escp】','【/escp】');
    </script>
    <?php
}
add_action('admin_print_footer_scripts', 'add_my_quicktag');

※上記ソースの4行目【escp】【/escp】は、functions.phpに記入の際、[escp][/escp]に置き換えてください。

クイックタグの設定内容についての説明は、別記事にしたいと思います。

上記の内容をfunctions.phpに記入する事で既存のボタンに、ECSPと言うボタンが追加されます。
使い方は他のボタンと同様です。

pタグは任意指定のキャンセル処理が一番

pタグの制御は一括で行うと1行で対応できますが、記事を書く時に「逆」に面倒です。
適度なところでWordpressに任せるのが一番だと思いますので、オリジナルの表組やソースを入れたい時にCSSだけだと上手くいかない事がある部分だけに指定してキャンセルする方事が良いと思います。
またクイックタグと組み合わせる事で記事の記載スピードも向上すると思いますので、合わせ技でつかってみてください。