アドセンス広告をスマホとパソコン使い分けてクリック率を上げる方法

今回はアドセンス広告のクリック率を上げる方法の1つ、
「スマホとパソコンでの使い分け」の方法を紹介します。
 

以下の記事で
レクタングルの大きいサイズの広告がクリック率が高くなる
と紹介しましたが、
アドセンス広告の貼り方で収入アップ!

大きいサイズを設定した時に
画面の小さなスマホでは
広告が画面からはみ出してしまうことがあります。

この問題を解決するのが
スマホ画面とパソコン画面で表示させる広告を変える方法です。
 

例えば、次のようにアドセンス広告を
スマホとパソコンで使い分けることによって、
クリック率も上げることができるんです。
 

  • スマホでは1つのレスポンシブ広告を表示する
  • パソコンでは2つのレクタングル広告
    (300 X 250サイズ)を横並びで表示する


 
アドセンス広告の貼り付け枚数に制限はありませんが、
ここでは同一記事内に3つ貼るとして紹介します。

このスマホ画面とパソコン画面で表示広告を使い分ける方法には
9種類の広告コードが必要になります。

パソコン用広告コード1・2(300 X 250サイズ)
パソコン用広告コード3・4(300 X 250サイズ)
パソコン用広告コード5・6(300 X 250サイズ)
スマホ用広告コード1
スマホ用広告コード2
スマホ用広告コード3

 
「パソコン用広告コード1・2」と「スマホ用広告コード1」、
「パソコン用広告コード3・4」と「スマホ用広告コード2」、
「パソコン用広告コード5・6」と「スマホ用広告コード3」は
同じ位置に貼るものとします。
 

以下にアドセンス広告をスマホとパソコンで
使い分ける方法を紹介します。
 

記事中にアドセンス広告を貼り付ける時は
「functions.php」を編集すればプラグインを使う必要はありません。

広告のショートコードを作成

まず、広告用ショートコードの作成です。
 

以下のようにショートコードを入力すると、
広告が表示されるように設定していきます。
アドセンス広告をスマホとパソコンで使い分ける
 

[ad1]:「パソコン用広告コード1・2」or「スマホ用広告コード1」を自動表示
[ad2]:「パソコン用広告コード3・4」or「スマホ用広告コード2」を自動表示
[ad3]:「パソコン用広告コード5・6」or「スマホ用広告コード3」を自動表示

 

ショートコードの作成は
「functions.php」を以下のように編集します。
 

WordPressのダッシュボードにある
「外観」→「テーマエディター」をクリックします。
WordPressの外観のテーマエディター
 

「functions.php」をクリックします。
WordPressダッシュボード-外観-テーマエディター-functions.php
 

「functions.php」内に以下のコードを追記します。

//■[ad1]の広告
function ad1($the_content){
  $ad_shortcode = '[ad1]';
  $ad_code_pc = <<< EOF
スポンサーリンク
★★パソコン用広告コード1★★ ★★パソコン用広告コード2★★ EOF; $ad_code_mobile = <<< EOF スポンサーリンク
★★スマホ用広告コード1★★ EOF; if (wp_is_mobile()) { $ad_code = $ad_code_mobile; } else { $ad_code = $ad_code_pc; } $the_content = preg_replace('{^(

)?'.preg_quote($ad_shortcode).'(

)?$}m', $ad_code, $the_content); return $the_content; } add_filter('the_content', 'ad1'); //■[ad2]の広告 function ad2($the_content){ $ad_shortcode = '[ad2]'; $ad_code_pc = <<< EOF スポンサーリンク
★★パソコン用広告コード3★★ ★★パソコン用広告コード4★★ EOF; $ad_code_mobile = <<< EOF スポンサーリンク
★★スマホ用広告コード2★★ EOF; if (wp_is_mobile()) { $ad_code = $ad_code_mobile; } else { $ad_code = $ad_code_pc; } $the_content = preg_replace('{^(

)?'.preg_quote($ad_shortcode).'(

)?$}m', $ad_code, $the_content); return $the_content; } add_filter('the_content', 'ad2'); //■[ad3]の広告 function ad3($the_content){ $ad_shortcode = '[ad3]'; $ad_code_pc = <<< EOF スポンサーリンク
★★パソコン用広告コード5★★ ★★パソコン用広告コード6★★ EOF; $ad_code_mobile = <<< EOF スポンサーリンク
★★スマホ用広告コード3★★ EOF; if (wp_is_mobile()) { $ad_code = $ad_code_mobile; } else { $ad_code = $ad_code_pc; } $the_content = preg_replace('{^(

)?'.preg_quote($ad_shortcode).'(

)?$}m', $ad_code, $the_content); return $the_content; } add_filter('the_content', 'ad3');

 

入力したら、「保存」をクリックします。
WordPressダッシュボード-外観-テーマエディター-ファイルを更新
 

以上で、ショートコードの作成が完了です。

 

これでスマホでサイトを見た時とパソコンでサイトを見た時に
表示される広告を変えることができます。
 

以上、今回はアドセンス広告を
スマホ用とパソコン用に使い分ける方法を紹介しました。
 

もし、広告サイズを使い分けていないのであれば、
ぜひ試してみてください。
 

最後まで読んで頂いてありがとうございました。

記事が価値あるものだと思われたら、
下のボタンからシェアをして頂けると嬉しいです。

ブログの始め方・稼ぎ方をまとめたガイドブックをプレゼント中!

↓↓↓メルマガ登録は下のフォームから↓↓

無料メールマガジン登録フォーム

メルマガ登録フォーム

苗字 (漢字で)
メールアドレス

※私からお送りする全てのメールに解除リンクを付けていますので、いつでもメルマガ解除をすることが可能です。




10件のコメントがあります

  1. 匿名 より:

    return後でPHPとして処理されず、記事のソースをHTMLで確認すると、
    スポンサーリンク

    という表示になってしまいます。
    どうしたらいいですか?

  2. 富山一史 より:

    匿名さん、コメントありがとうございます。

    確認ですが、広告コードを入力されてますか?
    広告コードでなくても良いので、確認のために何か文字を入力されてみてください。

    ↓こんな感じです。

    function showads1() {
    return'
    スポンサーリンク
    練習1 練習2 '; } add_shortcode('adsense1','showads1');

    ちなみに、以下のように入力すると文字はコメントアウトされ、記事上では表示されなくなります。

     
    ※記事内にコメントアウトのコードを入れてましたが、匿名さんからのコメントを受け、コメントアウトのコードを無くしました。
     

    不明点などあればまたコメントくださいね(^^)

    スマホ表示の確認は以下の記事をご参考に。
    Google Chromeで簡単スマホ画面確認

  3. オダ より:

    富山様

    やりたかったことがどこよりも分かりやすく書かれていて助かりました。
    ありがとうございます!

    1点質問したいのですが、
    スポンサーリンクという文字と、アドセンス広告をともにセンタリングするためのコードはどのように記述すればよいでしょうか?
    PC、スマホ、タブレット全てのデバイスで対応したいです。

    大変恐れ入りますが、お手すきの際に教えていただけますと幸いです。
    よろしくお願いいたします。

  4. 富山一史 より:

    オダさん、コメントありがとうございます。
    お役に立てたようで何よりです^^
     

    ご質問の件ですが、
    中央に寄せたい場合は以下で挟んでください。

     

    記事内の例で紹介した形で言うと以下のような形になります。

    // ■パソコン用広告コード1
    function adsense1() {
    return'
    
    スポンサーリンク
    '; } add_shortcode('ad1','adsense1'); // ■パソコン用広告コード2 function adsense2() { return'
    スポンサーリンク
    '; } add_shortcode('ad2','adsense2'); // ■パソコン用広告コード3 function adsense3() { return'
    スポンサーリンク
    '; } add_shortcode('ad3','adsense3'); // ■スマホ用広告コード1 function adsense4() { return'
    スポンサーリンク
    '; } add_shortcode('ad4','adsense4'); // ■スマホ用広告コード2 function adsense5() { return'
    スポンサーリンク
    '; } add_shortcode('ad5','adsense5'); // ■スマホ用広告コード3 function adsense6() { return'
    スポンサーリンク
    '; } add_shortcode('ad6','adsense6');

     

    一度試して頂いて、
    もし不明点や疑問点などありましたら、いつでもご連絡ください。

  5. オダ より:

    富山様

    早速お返事いただきありがとうございました。
    うまく対応できました!

  6. 富山一史 より:

    オダさん、上手くいってよかったです(^^)b
    また何かあればご連絡ください!

  7. より:

    初めまして。

    辻と申します。
    大変勉強になる記事です。
    ありがとうございます。

    質問があるんですが、
    【広告のショートコード】

    【スマホとパソコンの使い分けコード】
    ですが、

    functions.phpのどの辺りに挿入すればよろしいでしょうか?

    色々と試してみたんですが思うような結果が出ずに。

    大変恐れ入りますが、よろしくお願い致します。

  8. 富山一史 より:

    辻さん、コメントありがとうございます。
    富山です。

    コードはfunctions.phpの一番上になる「<?php」の下に挿入してみてください。
    もし、これで上手く行かないようであれば

    >いろいろと試してみた

    この部分を具体的に書いて頂けるとすぐに解決できるかと思います。

  9. より:

    富山さん。

    早速返信ありがとうございます(^^)

    富山さんのアドバイス通り_<)

  10. affikatsu.com より:

    辻さん、コメントありがとうございます!
    また何かありましたらご連絡ください(^^)

コメントを残す



コメントはサイト管理者が確認するまで表示されません。
他の読者さんにも有益だと判断した場合のみコメント対応を致します。

個別の問い合わせは【こちら】からお願いします。