アドセンスの制限コンテンツで空いた枠をすべて別の代替広告で埋めた方法

2021年3月27日

あまりこだわっていてもしかたがないのですが、アドセンスが非表示になって空いた穴を埋めておくことにしました。

当ブログではグーグルアドセンスの制限コンテンツにあたる記事がいくつかあり、それらの記事のアドセンス広告が非表示となった枠は、これまでは問題がないかぎり、そのまま（空白状態で）放置していたのですが、それらをすべて別のもので埋めておくことにしました。

今回作業をおこなったのは、サイドバーと記事下の2か所。ただ、これらはいずれも、PCとスマホで表示を分けていて、今回はそこ（PCとスマホという条件）に、特定の記事だけ広告を変えるという条件が加わることになったため、正直かなりややこしい作業となりました。

いちおう作業自体は完了したものの、自分自身がなにをしたのか忘れてしまう可能性もあるように思われたので、今回おこなった作業の内容を、ここに残しておきたいと思います。

PC・スマホで分けた広告を特定記事だけさらに分岐

当ブログの記事で制限コンテンツに引っかかっているのは電子タバコを扱った記事なのですが、それは全記事中のたった3記事だけだったので、べつにこれくらいならいいかと、これまでは放置することにしていました。

ところが、それらの無駄になってしまっている枠を、ちょうど別のものに張り替えようかと検討する機会があり、まずはそれ（PCとスマホの表示切り替え＋特定の記事のみさらに切り替え）ができるのかを考えていると、なんとかできそうだということが判明。

構想を実現に移すまでにひと悶着あったので時間がかかってしまいましたが（これはまた別の機会にお話ししますが）、具体的には、広告の配信が制限されている記事のうち、以下のものをアドセンスではない別のものに変更することにしました。

PC版ブラウザのサイドバーに設置したスカイスクレイパー（縦長）×1
PC版ブラウザの記事下に設置したレクタングル（四角）×2
スマホ版ブラウザの記事下に設置したレクタングル（四角）×1

この3つを、特定の記事だけ別のものにし、特定の記事以外は、これまでどおり変更はしない、というのが今回の作業の目的です。

内容がややこしく、文章だけだとわけがわからなくなってくるので、これは画像を用いて少し補足しておきましょう。

１. スカイスクレイパー×1（PC）

スカイスクレイパーは、PC版ブラウザで見たときの右側（サイドバー）に設置してある、縦長の大きい広告です。

スマホでは表示されない（スマホでは別のものが表示される）ように設定してあるため、PCはこれ、スマホは別、特定記事（制限コンテンツ）はあれ、というふうに、3段階の分岐が必要となります。

２. レクタングル×2（PC）

レクタングル広告×2（PC）は、PC版ブラウザで見たときの記事下に設置してある、横並びになった四角い広告です。

これもPCだけで表示されるように設定してあるものなので（スマホは別）、スカイスクレイパーと同じく、3段階の分岐が必要となってきます。

３. レクタングル×1（スマホ）

レクタングル広告×1（スマホ）は、スマホ版ブラウザで見たときの記事下に設置してある、四角い広告です。

これはレクタングル広告×2（PC）をブラウザの違いで分岐させたものなので、やはり3段階の分岐は必要となりますが、2番目のレクタングル×2と連動していることから、そっちができてしまえば、これはそのまま表示の切り替えが可能となるように思われました。

ようは、通常PCはこれ、通常スマホはそれ、制限PCはあれ、制限スマホはどれ、というように、設置した広告の表示を分けていく、ということです。

記事下はPC・スマホ・特定記事の3パターン分岐

今回の作業は、レンタルサーバーの「FTP」から「PHPファイル」をつくり、条件分岐というタグを使用して、「PCはA、スマホはB、特定記事（PC・スマホ）はCの広告を表示させる」というような内容を書き、それを表示させたい場所に呼び出すというものになります。

縦長のスカイスクレイパーは、以前作成した「PHPファイル」がそのまま使えたので、まずはレクタングルのほうから作業を進めていくことにしました。

まずは新しい「PHPファイル」を作成する

これまで記事下に、PCはレクタングル2連、スマホは1連、というふうにアドセンスを表示させていたのは、「double-rectangle.php」というファイルを作成し、以下のように条件分岐をさせることで可能となっていました。

<div class="double-rectangle">
　<?php if (is_mobile()) :?>
　　/*ここにスマホのアドセンスのコード（A）*/
　<?php else: ?>
　<div class="left-rectangle">
　　/*ここにPCのアドセンスのコード（B）*/
　</div>
　<div class="right-rectangle">
　　/*ここにPCのアドセンスのコード（C）*/
　</div>
　<?php endif; ?> 
</div>

条件分岐のタグでスマホは「A」というレクタングル広告を表示させ、それ以外のPCでは「B・C」というレクタングル広告を表示させていたわけです。

かなり前に作成したものということもあって今回は割愛しますが、全体（double-rectangle）を「css」で調整したあと、「left-rectangle」と「right-rectangle」に横並びの属性を付与することで、アドセンスが横にならぶようになっています。

しかし今回は、これとは別に、制限コンテンツに表示させるものを用意しなければならなかったので、新たに「double-rectangle2.php」というものを作成することにしました。内容は以下のとおりです。

<div class="double-rectangle">
　<?php if (is_mobile()) :?>
　　/*ここにスマホの別の広告コード（D）*/
　<?php else: ?>
　<div class="left-rectangle">
　　/*ここにPCの別の広告コード（E）*/
　</div>
　<div class="right-rectangle">
　　/*ここにPCの別の広告コード（F）*/
　</div>
　<?php endif; ?> 
</div>

表示させるものをただ入れ替えただけですね。今回はちょうど同じサイズのものがあったので、Amazonと楽天の四角い広告を設置することにしました。

条件分岐の解説と最後の作業の前段階はこちら
→ ウィジェットでのPC・スマホの表示切替をプラグインなしで実装した方法

呼び出していた「contents.php」をいじる

これまでPCではレクタングル2連、スマホでは1連のアドセンスを呼び出していたのは、WordPressの「contents.php」というファイルに、直接それを呼び出すコードを書いておこなっていて、もともとは以下のようになっていました。

<?php 
if ( is_single() ) {
get_template_part( 'double-rectangle' ); 
}
?>

記事下にあたる部分にこれを記述することで、個別投稿の記事（すべて）の記事下に、「double-rectangle」、つまりPC2連・スマホ1連と分岐させたアドセンスを表示させる、としていたわけです。

しかし、一部の制限コンテンツに別のものを表示させるためには、これをいったん解除しなければならなかったので、次の手順として、以下のように特定の記事だけアドセンスを非表示としました。

<?php 
if ( is_single() && !is_single( array( 001,002,003 ) ) ) {
get_template_part( 'double-rectangle' ); 
}
?>

アドセンスを個別投稿の記事（すべて）には表示させるけれど、否定を意味する「!」を使ったから、「001、002、003」の記事だけは除外するよ、ということになったわけです。

そして、ここからが本題。

その次は、アドセンスを個別投稿の記事に表示させて、「001、002、003」の記事だけを除外したけれど、今度はその除外した部分に別のものを表示させるよ、という3段階目へ踏み込まなければなりません。

では、どうすればそれが実現できるのかというと、これは複数の条件分岐を可能とする「elseif」というものを使用します。

条件分岐の複数型「elseif」を使う

この「elseif」というものは、条件分岐の基本形（Aという条件だったらBをする）に、複数の条件（Cという条件だったらDをする）を加えて、1つの文で実行することができるというもの。

わかりやすくたとえると……

こういうことができてしまうのです！

ということで、さっそく実装してみると、以下のようになりました。

<?php 
if ( is_single() && !is_single( array( 001,002,003 ) ) ) {
get_template_part( 'double-rectangle' ); 
} elseif ( is_single( array( 001,002,003 ) ) ) {
get_template_part( 'double-rectangle2' ); 
}
?>

これによって、特定の記事（001、002、003）以外には「double-rectangle」で通常のアドセンスを表示させ、除外した特定の記事（001、002、003）には、「double-rectangle2」で、アドセンス以外のものを表示させることに成功しました。

PC・スマホでの動作確認もOKです！

サイドバーは「elseif」を2回使って4パターン分岐へ

先ほどの「elseif」というものは、「Aという条件ならBをする、Cという条件ならDをする、AでもCでもなければEをする」というのが基本形で、先ほどは「Eをする」が必要なかったので省略しましたが、サイドバーの広告を分岐するためにはこれが必要になったので、今回はこの基本形で作業を進めていきます。

これもわかりやすくたとえると……

ということになるわけです！

それでは、サイドバーの作業も進めていきましょう。もともとサイドバーのアドセンスを表示させていたのは、「widget-ad.php」というファイルを作成し、ウィジェットで呼び出して表示させることにしていて、「widget-ad.php」の内容は、以下のとおりとなっていました。

<?php if (is_mobile()) :?>
/*ここにスマホのアドセンスコード（A）*/
<?php else: ?>
/*ここにPCのアドセンスコード（B）*/
<?php endif; ?>

基本の条件分岐を使用して、PC・スマホで、サイドバーに表示させるアドセンスを使い分けていたわけです。

ただ、PC版のブラウザでは、制限コンテンツの記事となると、ほぼ100％アドセンスは非表示となっていたものの、スマホ版ブラウザでは、表示させる場所の関係もあるのか、こちらではほとんど表示されていたので、この作業は、ひとまず特定の記事のPCだけアドセンスを別のものにする、ということをおこなうことにしました。

先ほどと同じ要領で「PHPファイル」をいじっていき、できあがったのがこちら。

<?php if (is_mobile()) :?>
/*ここにスマホのアドセンスコード（A）*/
<?php elseif ( is_single( array( 001,002,003 ) ) ) :?>
/*ここにPCの別のコード（C）*/
<?php else: ?>
/*ここにPCのアドセンスコード（B）*/
<?php endif; ?>

これによって、特定の記事（001、002、003）の、PC版ブラウザに表示されるアドセンス（スカイスクレイパー）だけ「C」という別の広告を表示させ、それ以外（特定の記事のスマホも含む）は、そのままアドセンスを表示させることに成功しました。

スマホも変更したい場合は、「is_mobile()」のあとに、これも先ほどと同じく「&& !is_single( array( 001,002,003 ))」と、一部を否定する条件を付け加えてあげ、じつは複数回使うこともできる「elseif」で、以下のように条件を指定してあげればOK！

<?php if (is_mobile() && !is_single( array( 001,002,003 ))) :?>
/*ここにスマホのアドセンスコード（通常A）*/
<?php elseif (is_mobile() && is_single( array( 001,002,003 ) ) ) :?>
/*ここにスマホのアドセンスコード（制限A）*/
<?php elseif ( is_single( array( 001,002,003 ) ) ) :?>
/*ここにPCのアドセンスコード（制限B）*/
<?php else: ?>
/*ここにPCのアドセンスコード（通常B）*/
<?php endif; ?>

こうすることによって、特定の記事以外のスマホには「通常A」、特定の記事のスマホには「制限A」、特定の記事のPCには「制限B」、特定の記事以外のPCには「通常B」という、4パターンの広告を表示させることができます。

やりたいことはすべてできたように思うので、今回の作業はこれで終了となります。