WordPress

WordPressでH2タグの直後に画像やテキストを挿入する

WordPressでH2タグの直後に画像やテキストを挿入する方法を紹介します。
カテゴリごとに違う画像を挿入したりと、様々な拡張ができますので、ぜひ使いこなしてみてください。

メリット

どうしてこんなことしているのかというと、僕のSEOに関する仮説として、”どれだけスクロールされたか”があると思っています。
あるのは確実として、それはかなり大きな割合だとも思っています。

また、ユーザーの滞在時間も重要と言われています。これは有名ですね。

スクロールをするということは、その分滞在時間が伸びるということです。
広告を見たり、画像を見たり、そういったコンマ単位の時間が重要になってきます。

どれだけユーザーを離さない作りになっているか、これが要点ということです。

PHPで正規表現置換

PHPで正規表現置換をするには、以下のコードを実行してもらうと早いかと思います。

<?php
$string = 'aaa</h2>aaa';
$pattern = '/(<\/h2>)/i';
$replacement = '$1aiu';

  $return .= preg_replace($pattern, $replacement, $string) ;

  echo $return;


WordPressでは本文全体を置換対象とするので、$string = 'aaa</h2>aaa';$string = $the_content;とします。これだけの違いです。

はじめてPHPの正規表現を書いたんですが、Rubyと違って正規表現置換はちょっと書きにくいですね。Rubyであればgrepで簡潔に書けますからね。

wordpressでテスト

以下のコードをfunction.phpに書いて、サイトを更新してみましょう。

function category_1_1($the_content) {
    if (is_single() && in_category(array('ゲーム'))) {

      $string = $the_content;
      $pattern = '/(<\/h2>)/i';
      $replacement = '$1aiu';

        $return .= preg_replace($pattern, $replacement, $string) ;

        return $return;

    } else {
        return $the_content;
    }
}

add_filter('the_content','category_1_1');

これで”ゲーム”カテゴリの記事のH2のあとに、文字列”aiu”が追加されているはずです。

画像を挿入

では、本題、画像を挿入していきましょう。
簡単です。imgタグのHTMLを書いていけばいいだけです。


function category_image_1($the_content) {
    // if (is_single() && in_category(array('プログラミング'))) {

      $string = $the_content;
      $pattern = '/(<\/h2>)/i';
      $replacement = '$1
            <img src="https://techiecode.files.wordpress.com/2013/05/url3.png"
            alt="プログラミング" width="1200" height="600"/>
            ';

        $return .= preg_replace($pattern, $replacement, $string) ;

        return $return;

    // } else {
    //     return $the_content;
    // }
}

add_filter('the_content','category_image_1');

例として、当サイト用に書いたコードを見てみてください。

当サイトではカテゴリごとに画像を変更するのはやめました。結構面倒なので。

altタグを書いておくのも忘れないようにしましょう。

H1タグ直後に挿入

H1タグ直後に挿入しようと思ったんですが、なぜかh1直後だと挿入できなかったです。
ソース見ても変化無いし、コードは間違ってないし…で、これ以上時間も使いたくなかったので、諦めました。謎だ…

テーマによってはこういうことがあるのかもしれないです。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です