楽ブログ

楽に楽しくやるブログ

スポンサーリンク(レスポンシブ)横長

スポンサーリンク

WordPressで<h2>タグの直前にGoogle Adsenseを関数1つで表示する方法

2016/09/12

Google Adsense

最近は私も、Google Adsenseをブログに貼るなんてことを憶えまして。

あまりやるとサイトの評価が下がるという意見も目にしつつ、面白いんでいろんなサイズのをペタペタ貼り付けたりしてるんですが。

もっぱらウィジェットを使ってサイドバーなどの記事の外側にやってたところへ、記事の中に表示するのも効果的という評判を聞きまして。

早速やってみたんで、メモとして記事にしておきますよと。

関数を使って<h2>タグの直前にGoogle Adsenseのスクリプトを出力するようにする

やってみると意外と簡単で、以下の関数を「function.php」というファイルの一番下に追加してやるだけでした。

function disp_google_adsense($content) {
// Google Adsence スクリプトを変数に入れる
$google_ad = <<< EOD
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
 ・
 ・
 ・
</script>

EOD;
    if (is_single()) {
        $tag = '<h2';
        $pos = strrpos($content, $tag);
        if($pos !== false) {
            $content = substr_replace($content, $google_ad, $pos, 0);
        }
    }
    return $content;
}
add_filter('the_content','disp_google_adsense');

おおまかに説明しますと、まず最初にヒアドキュメントを使って、変数にアドセンスのスクリプトを代入してやってます。

このソースリストでは省略してますが、2つの“EOD”が記述されたそれぞれの行に挟まれた黄字の部分に、表示したいアドセンスのスクリプトを記述します。

その下の“if (is_single())”のIF文は、個別記事のページのときだけアドセンスが表示されるようにするための条件です。

そして「strrpos関数」を使って、“<h2”というキーワードで記事の中から<h2>タグの位置を「後ろから」検索しています。

なぜ「後ろから」なのかというと、私は記事の一番最後の<h2>タグの直前にアドセンスを表示させたかったからなんですね。

最初の<h2>タグの直前に表示させたい場合は、「strrpos関数」の代わりに「strpos関数」を使うといいでしょう。

さて続いて、記事の中に<h2>タグが存在した場合、「substr_replece関数」を使って先に変数に代入したアドセンスのコードを記事中に挿入してやります。

ここで「substr_replace関数」は、文字列中の一部を別の文字列に置換する関数でして。

ちなみにその4つの引数の意味は、1つ目が元になる文字列で2つ目が置換に使う文字列、そして3つ目が置換開始位置を指定して、4つ目が置換する範囲つまり文字数を指定します。

今回は置換ではなく挿入するので、置換する文字数を“0”にしてあります。

最後に、処理が完了した記事の文字列を“return”で返してやって終了です。

PC表示とスマホ表示を分けたい場合

もしかしたら、PCで表示するときとスマホなどで表示するとき、それぞれ違うサイズの広告を表示したいような場合があるかも知れませんね。

そういう場合は、以下のようにアドセンスのスクリプトを2つ用意して、「wp_is_mobile関数」を使って条件分けをすると良いでしょう。

function disp_google_adsense($content) {
// Google Adsence スクリプトを変数に入れる
$google_ad1 = <<< EOD1
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
 ・
 ・【スマホ用のスクリプト】
 ・
</script>

EOD1;
$google_ad2 = <<< EOD2
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
 ・
 ・【PC用のスクリプト】
 ・
</script>

EOD2;
    if (is_single()) {
        $tag = '<h2';
        $pos = strrpos($content, $tag);
        if($pos !== false) {
            if(wp_is_mobile()) {    //スマホの場合
                $content = substr_replace($content, $google_ad1, $pos, 0);
            } else {                //PCの場合
                $content = substr_replace($content, $google_ad2, $pos, 0);
            }
        }
    }
    return $content;
}
add_filter('the_content','disp_google_adsense');

ちなみに、当ブログでも使用しているテーマの「STINGER PLUS+」には、より精度の高い「st_is_mobile関数」というのが用意されてますから、そちらを使ったほうが良いですね。

スポンサーリンク

まとめ

というわけで関数1つだけで、Google Adsenseの広告を<h2>タグの直前に挿入できるようになりました。

おそらく当記事でも、この「まとめ」の章タイトルの上に広告が表示されてるかと思いますが、いかがでしょう。

これを応用すれば、記事内のいろんなところに自由に何でも貼り付けることができそうで面白いと思いませんか?

それでは、楽しいWordPressライフを!

記事下アフィリウィジェット


こちらは、WordPressの基礎を勉強したい人におすすめの書籍です。

WordPressレッスンブック HTML5&CSS準拠

著者:エビスコム

amazon

楽天で探す

いちばんやさしいWordPressの教本

人気講師が教える本格Webサイトの作り方 第2版 WordPress 4.x対応

amazon

楽天で探す

楽天モーションウィジェット(600×200)スマホ非表示

-ブログの話
-,