WordPressで最初のh2の前に要素を一括挿入する方法
WordPressでページの最初のh2の前に要素を一括挿入したいケースは、下記の通り珍しくありません。
- CTAを挿入したい
- 著者・監修者情報を挿入したい
- 広告を挿入したい
そこでこの記事では、プラグインを使わずにこれを実現するPHPコードを解説します。
目次
WordPressで最初のh2の前に要素を一括挿入する方法
PHPは下記の通りです。挿入したい要素のHTMLや適用したいディレクトリなどを書き換えた上で、functions.phpに追記してください。
function insert_html_before_first_h2($content) {
// 現在のURLのパス部分を取得
$request_uri = $_SERVER['REQUEST_URI'];
// '/column/'がパスに含まれる場合のみ、HTMLを挿入する
if (strpos($request_uri, '/column/') !== false) {
// 挿入したいHTML
$html_to_insert = '<!-- 挿入したいHTML -->';
// 最初のh2タグを見つける
$first_h2_pos = strpos($content, '<h2');
// h2タグがあれば、指定したHTMLを挿入する
if ($first_h2_pos !== false) {
$content = substr_replace($content, $html_to_insert, $first_h2_pos, 0);
}
}
return $content;
}
add_filter('the_content', 'insert_html_before_first_h2');
コードの解説は下記の通りです。
関数を定義
今回の処理をおこなう関数としてinsert_html_before_first_h2()を定義し、引数として記事のコンテンツである$contentを受け取ります。
現在のURLのパスを取得し、変数に保存
$_SERVER['REQUEST_URI']により現在のURLのパスを取得して、変数$request_uriに保存します。
現在のURLが特定のディレクトリを含むかをチェック
特定のディレクトリがURLに含まれている場合にのみ、HTMLを挿入する後述の処理を実行します。
なお、strpos()関数は、文字列が見つかった場合はその位置を、見つかれなかった場合はfalseを返します。そのため、trueかどうかではなく、falseでないかをチェックする必要があります。
挿入するHTMLを変数に保存
挿入したいHTMLを記述して変数$html_to_insertに保存します。
$content内で最初の<h2>タグの位置を検索し、その位置を変数に保存
strpos関数によって、$contentの中の最初のh2の位置を取得します。h2がclassやidなどの属性を持つことも多いので、閉じタグを含めない'<h2'を検索文字列としています。
substr_replace関数を使ってHTMLを挿入
引数の説明は下記の通りです。
$content- 置換対象の文字列。
$html_to_insert- 置換する文字列（今回の場合、事前に変数に保存したHTML）。
$first_h2_pos- 置換を開始する位置（この場合、最初のh2タグの位置）。
0- 置換する部分文字列の長さ。0を指定することで、元の文字列を削除せずに新しい文字列が挿入されます。
$contentをリターン
$contentをリターンします。この$contentは、指定したディレクトリがURLに含まれている場合にはHTMLを最初のh2の前に挿入する処理が施されたものであり、そうでない場合は何も更新がされていないものになります。
add_filter関数を使って、関数をthe_contentフィルターに追加
コンテンツが表示される前にinsert_html_before_first_h2関数が実行され、指定されたHTMLが挿入されます。