Simplicity(WordPress)でGoogle AdSense広告をhタグで自動挿入する方法 [プラグイン不要]

サイト運営

WordPressの人気テーマ「Simplicity」は無料テーマとは思えないほど充実した機能を搭載しており、本ブログでも採用しています。

参考 Simplicity 公式サイト

ブログの収益性を高めるために広告配置に関しても様々なカスタマイズ機能が標準で提供されていますが、「記事中に広告を自動配置」するにはユーザー側で手動の設定が必要となります。

そこで本記事では、WordPressテーマ「Simplicity」を例に、Google AdSense広告をhタグで自動挿入する方法を紹介します。

本手法は、「Simplicity」テーマの作者である「わいひら」さんのブログ「寝ログ」で紹介されていた方法を参考にしています。

参考 寝ログ – 【アドセンス収益向上】簡単!プラグインやショートコード不要でWordPress記事中に広告を挿入する方法

別途プラグインやショートコードの用意は不要で、さらにタグの種別や番号によって広告の有無を調整するなど、細かいニーズまで対応できるオススメの手法です!

photo by Eran Sandler

 

Simplicityで広告をhタグで自動挿入する方法

本記事ではWordPressの「Simplicity」テーマで「h3タグ前」に「Google AdSense広告」を自動挿入する方法を例に說明をしています。

検証はしていませんが、「Simplicity」以外のテーマや「AdSense広告」以外の場合でも応用が効くと思うので、ぜひご参考あれ。

 

手順①:広告ユニットのコードを用意する

まず、Google AdSenseにて「h3タグ前」に設定する広告ユニットのコードを新規取得します。

ボクの場合は、PC向けにレクタングル大(336×280)広告とスマホ向けにレスポンシブ広告を用意し、さらにh3タグの番号ごとで収益性を分析するために、h3タグ10個分の広告ユニットを用意しました。

つまり、タグ10個分(h3タグ2番目〜11番目)の広告を、それぞれPCとスマホ別に用意したため、10×2=20の広告ユニットを新規作成したことになります。

本ブログは記事によってh3タグが10個登場するケースがあるため、目安としてh3タグ10個分の広告ユニットを用意しています。この部分は、運営するブログのスタイルに合わせて数を増減させるべきです。
本ブログはh3タグを說明の区切りとして多用するため、「h3タグ前」に広告を自動挿入する設定をしています。もしh2タグやh4タグを多用しているなら、ブログに合わせて変更して下さい。
手順①をスキップして、すでにある広告ユニットのコードを使用しても、「広告を記事中に自動挿入する」ことに関しては問題なく実現できます。ただし、後々広告ユニットのパフォーマンス分析をすることを考えると、PCとスマホ別にh3タグの数だけ広告ユニットを取得しておくことをオススメします。

 

手順②:子テーマのfunctions.phpを編集する

設置する広告ユニットのコードを用意できたら、続いて「Simplicity」子テーマのfunctions.phpを開きます。

functions.phpを編集する前に、予めコードをバックアップしておくと万が一カスタマイズの途中でエラーが発生した場合でも安心です。

その後、下記コードを「functions.php」の空きスペースに貼り付けます。

//以下に本文記事h3タグ前に広告を表示する関数を書く

function add_ad_before_h3_for_10times($the_content) {
//h3タグ2つ目前の スマホ用 広告タグを挿入
$ad1 = <<< EOF
//ココにスマホ向け広告ユニットコード1つ目を入れる
EOF;
//h3タグ2つ目前の PC用 広告タグを挿入
$ad1_pc = <<< EOF
//ココにPC向け広告ユニットコード1つ目を入れる
EOF;
//h3タグ3つ目前の スマホ用 広告タグを挿入
$ad2 = <<< EOF
//ココにスマホ向け広告ユニットコード2つ目を入れる
EOF;
//h3タグ3つ目前の PC用 広告タグを挿入
$ad2_pc = <<< EOF
//ココにPC向け広告ユニットコード2つ目を入れる
EOF;

//以下設置するh3タグの数に合わせて繰り返す

if ( is_single() ) {//投稿ページ
$h3 = '/^<h3.*?>.+?<\/h3>$/im';//H3見出しのパターン
if ( preg_match_all( $h3, $the_content, $h3s )) {//H3見出しが本文中にあるかどうか
if ( $h3s[0] ) {//チェックは不要と思うけど一応
if ( $h3s[0][1] ) {//2番目のH3見出し手前に広告を挿入
if ( is_mobile() ) {
$the_content  = str_replace($h3s[0][1], $ad1.$h3s[0][1], $the_content);
}
else  {
$the_content  = str_replace($h3s[0][1], $ad1_pc.$h3s[0][1], $the_content);
}
}
if ( $h3s[0][2] ) {//3番目のH3見出し手前に広告を挿入
if ( is_mobile() ) {
$the_content  = str_replace($h3s[0][2], $ad2.$h3s[0][2], $the_content);
}
else  {
$the_content  = str_replace($h3s[0][2], $ad2_pc.$h3s[0][2], $the_content);
}
}

//以下設置するh3タグの数に合わせて繰り返す

}
}
}
return $the_content;
}
add_filter('the_content','add_ad_before_h3_for_10times');

下記より上記コードの解説をします。

 

広告ユニットを入れる

まず、コード前半にある「//ココに〇〇向け広告ユニットコード△つ目を入れる」の部分に、手順①で作成した広告ユニットを入れます。

・・・
//h3タグ2つ目前の スマホ用 広告タグを挿入
$ad1 = <<< EOF
//ココにスマホ向け広告ユニットコード1つ目を入れる
EOF;
//h3タグ2つ目前の PC用 広告タグを挿入
$ad1_pc = <<< EOF
//ココにPC向け広告ユニットコード1つ目を入れる
EOF;
・・・

例えば2番目のh3タグに関する設定なら、「2番目のh3タグ」用に作成したPC向け&スマホ向け広告ユニットを2パターン入れます。

これが3番目、4番目、・・・となれば、同様に「3番目」用 or 「4番目」用に作った広告ユニットをペーストすればOKです。

 

h3タグ前に広告を設置する

次に、コード後半にある「//△番目のH3見出し手前に広告を挿入」が、h3タグの番号ごとPC向け&スマホ向け広告ユニットの設置を定義しています。

・・・
if ( $h3s[0][1] ) {//2番目のH3見出し手前に広告を挿入
if ( is_mobile() ) {
$the_content  = str_replace($h3s[0][1], $ad1.$h3s[0][1], $the_content);
}
else  {
$the_content  = str_replace($h3s[0][1], $ad1_pc.$h3s[0][1], $the_content);
}
}
・・・

このうち、登場する数字が指定するタグ番号を示しています。例えば数字を★とすると、

・・・
if ( $h3s[0][★] ) {//★+1番目のH3見出し手前に広告を挿入
if ( is_mobile() ) {
$the_content  = str_replace($h3s[0][★], $ad1.$h3s[0][★], $the_content);
}
else  {
$the_content  = str_replace($h3s[0][★], $ad1_pc.$h3s[0][★], $the_content);
}
}
・・・

★の数字は下記の通り、0を1番目として数が増えるごとに指定するタグ番号が決まります。

★が0:h3タグ1番目を示す

★が1:h3タグ2番目を示す

★が2:h3タグ3番目を示す

★が3:h3タグ4番目を示す

 

以上をh3タグの数だけ増やす

貼り付けたコードは2番目と3番目のh3タグの前にだけ広告を自動挿入する設定となっているので、自身のブログに設定するh3タグの数だけ以上の手順を繰り返します。

h3タグの数だけ追記ができたら、ブログをチェックしてみて下さい。すべての記事において、自動的にh3タグの前にGoogle AdSenseの広告ユニットが表示されているはずです。

 

参考①:h2タグやh4タグの前に自動挿入する場合

今回はh3タグ前に設定する方法を例に說明しましたが、もしh2タグやh4タグ前に広告を入れたい場合、コード内の「h3」の箇所を「h2」や「h4」に変更するだけでOKです。

例えばh2タグの前に自動挿入したいなら下記のようになります。

//以下に本文記事h2タグ前に広告を表示する関数を書く

function add_ad_before_h2_for_10times($the_content) {
//h2タグ2つ目前の スマホ用 広告タグを挿入
$ad1 = <<< EOF
//ココにスマホ向け広告ユニットコード1つ目を入れる
EOF;
//h2タグ2つ目前の PC用 広告タグを挿入
$ad1_pc = <<< EOF
//ココにPC向け広告ユニットコード1つ目を入れる
EOF;
//h2タグ3つ目前の スマホ用 広告タグを挿入
$ad2 = <<< EOF
//ココにスマホ向け広告ユニットコード2つ目を入れる
EOF;
//h2タグ3つ目前の PC用 広告タグを挿入
$ad2_pc = <<< EOF
//ココにPC向け広告ユニットコード2つ目を入れる
EOF;

//以下設置するh2タグの数に合わせて繰り返す

if ( is_single() ) {//投稿ページ
$h2 = '/^<h2.*?>.+?<\/h2>$/im';//H2見出しのパターン
if ( preg_match_all( $h2, $the_content, $h2s )) {//H2見出しが本文中にあるかどうか
if ( $h2s[0] ) {//チェックは不要と思うけど一応
if ( $h2s[0][1] ) {//2番目のH2見出し手前に広告を挿入
if ( is_mobile() ) {
$the_content  = str_replace($h2s[0][1], $ad1.$h2s[0][1], $the_content);
}
else  {
$the_content  = str_replace($h2s[0][1], $ad1_pc.$h2s[0][1], $the_content);
}
}
if ( $h2s[0][2] ) {//3番目のH2見出し手前に広告を挿入
if ( is_mobile() ) {
$the_content  = str_replace($h2s[0][2], $ad2.$h2s[0][2], $the_content);
}
else  {
$the_content  = str_replace($h2s[0][2], $ad2_pc.$h2s[0][2], $the_content);
}
}

//以下設置するh2タグの数に合わせて繰り返す

}
}
}
return $the_content;
}
add_filter('the_content','add_ad_before_h2_for_10times');

これをh2タグの数だけ調整する必要があるのは、先ほどまでのh3タグの說明と同様です。

 

参考②:奇数(偶数)番目のタグにのみ設定する場合

今回は記事中の2番目以降のh3タグすべてに広告を設定する方法を例に說明しましたが、もし2番目と4番目と6番目のh3タグの前にだけ自動挿入としたい場合、コード後半にある「//△番目のH3見出し手前に広告を挿入」の★部分を変えればOKです。

・・・
if ( $h3s[0][★] ) {//★+1番目のH3見出し手前に広告を挿入
if ( is_mobile() ) {
$the_content  = str_replace($h3s[0][★], $ad1.$h3s[0][★], $the_content);
}
else  {
$the_content  = str_replace($h3s[0][★], $ad1_pc.$h3s[0][★], $the_content);
}
}
・・・

先にも述べた通り、★の数字は0を1番目として数が増えるごとに指定するタグ番号が決まります。

★が0:h3タグ1番目を示す

★が1:h3タグ2番目を示す

★が2:h3タグ3番目を示す

★が3:h3タグ4番目を示す

つまり、h3タグの偶数番目にのみ広告を設置したいなら★を奇数とすれば良いですし、タグの奇数番目であれば★を偶数とすればOKです。

例えばh3タグに関して、2番目と4番目の前にだけ広告を入れるなら、下記のようになります。

//以下に本文記事h3タグ前に広告を表示する関数を書く

function add_ad_before_h3_for_2times($the_content) {
//h3タグ2つ目前の スマホ用 広告タグを挿入
$ad1 = <<< EOF
//ココにスマホ向け広告ユニットコード1つ目を入れる
EOF;
//h3タグ2つ目前の PC用 広告タグを挿入
$ad1_pc = <<< EOF
//ココにPC向け広告ユニットコード1つ目を入れる
EOF;
//h3タグ4つ目前の スマホ用 広告タグを挿入
$ad2 = <<< EOF
//ココにスマホ向け広告ユニットコード2つ目を入れる
EOF;
//h3タグ4つ目前の PC用 広告タグを挿入
$ad2_pc = <<< EOF
//ココにPC向け広告ユニットコード2つ目を入れる
EOF;

//以下設置するh3タグの偶数に合わせて繰り返す

if ( is_single() ) {//投稿ページ
$h3 = '/^<h3.*?>.+?<\/h3>$/im';//H3見出しのパターン
if ( preg_match_all( $h3, $the_content, $h3s )) {//H3見出しが本文中にあるかどうか
if ( $h3s[0] ) {//チェックは不要と思うけど一応
if ( $h3s[0][1] ) {//2番目のH3見出し手前に広告を挿入
if ( is_mobile() ) {
$the_content  = str_replace($h3s[0][1], $ad1.$h3s[0][1], $the_content);
}
else  {
$the_content  = str_replace($h3s[0][1], $ad1_pc.$h3s[0][1], $the_content);
}
}
if ( $h3s[0][3] ) {//4番目のH3見出し手前に広告を挿入
if ( is_mobile() ) {
$the_content  = str_replace($h3s[0][3], $ad2.$h3s[0][3], $the_content);
}
else  {
$the_content  = str_replace($h3s[0][3], $ad2_pc.$h3s[0][3], $the_content);
}
}

//以下設置するh3タグの偶数に合わせて繰り返す

}
}
}
return $the_content;
}
add_filter('the_content','add_ad_before_h3_for_4times');

すべてのh3タグの前に広告を設置するとユーザビリティを悪化させる一因となりかねないため、サイトの見栄えを良くしたり、重さを軽減したい場合にオススメな設定です。

 

〆:広告を自動挿入して収益性を高めよう!

以上、Simplicity(WordPress)でGoogle AdSense広告をhタグで自動挿入する方法 [プラグイン不要] の說明でした。

プラグインやショートコードを使わない分、子テーマのfunctions.phpを直接編集する必要があるため、少々ハードルが高いかもしれません。

ただ記事で紹介した通り、カスタマイズする部分の規則性はカンタンなので、自身のブログ方針に沿って設定してみて下さい。

ぜひ、お試しあれ。

サイト運営
おるくすをフォローする

関連記事

あっとはっく

コメント