SimplicityでAdsenseの広告ユニットを個別にする方法

20150412-eyecatch

miyamoです。

日刊すあろぐ!ではWordPressのテーマとして、Simplicityを使っています。

SimplicityはGoogle Adsenseの広告を貼る場合に、設定するだけでSEO上有利と思われる場所に、自動的に貼ってくれます。

しかし、設定で使える広告ユニットは1種類だけです。効果測定をするために、3つ貼れる広告に別々の広告ユニットを使いたいということも、あると思います。

少しのカスタマイズで、3つの広告に別々の広告ユニットを使えるようになりましたので、その方法をお伝えします。

Simplicityのバージョンは最新の1.6前提です。(2015年4月現在)

それでは、いってみよー。

photo by Katie Brady

スポンサーリンク

Simplicityの設定

Simplicityは、次のように設定しておきます。WordPressのダッシュボードメニューから、「外観」→「カスタマイズ」を選んでください。

レイアウト(全体・リスト)の設定

レイアウト(全体・リスト)の設定は、完全レスポンシブデザインにするのチェックを外した状態が必要です。このチェックが必要な方は、今回のカスタマイズはできません。

20150412-1

今回のカスタマイズは、この設定がされている前提で行います。

広告の設定

次に広告内の設定を行います。メニューから広告を開いて、本文記事中(H2見出し手前)にしてください。

20150412-2

収益面からも、H2見出し手前に1つ広告がある方が、クリック率が上がるとの話は多いですね。

手順1:広告ユニットを貼るウィジェットを増やす

Simplicityでは、Adsenseの広告ユニットをウィジェットに設定します。しかし、Adsense用のウィジェットが1つしか無いため、複数の広告ユニットを使うことができません。

このウィジェットを、増やすことで複数の広告ユニットが使えるようになります。

親テーマのfunction.phpを見てみる

Adsenseのウィジェットは、親テーマのfunction.phpで以下のように設定されています。

register_sidebars(1,
  array(
  'name'=>'広告 336x280',
  'id' => 'adsense-336',
  'description' => '336×280pxの広告を入力してください。',
  'before_widget' => '',
  'after_widget' => '',
  'before_title' => '<div class="widget-ad">',
  'after_title' => '</div>',
));

この記述があるおかげで、ウィジェットに「広告 336×280」という名前のウィジェットができあがります。ということは、あと2つ、このウィジェットを作ればいいのですね。

Adsense広告ユニット用のウィジェットを2つ追加する

子テーマのfunction.phpに次の記述を追加してください。

親テーマのfunction.phpを修正してもいいのですが、親テーマがアップデートされた時に上書きされ、カスタマイズ部分が消えてしまいます。カスタマイズする場合は、子テーマを使うことをおすすめします。

register_sidebars(1,
  array(
  'name'=>'広告 336x280-2',
  'id' => 'adsense-336-2',
  'description' => '336×280pxの広告を入力してください。',
  'before_widget' => '',
  'after_widget' => '',
  'before_title' => '<div class="widget-ad">',
  'after_title' => '</div>',
));

register_sidebars(1,
  array(
  'name'=>'広告 336x280-3',
  'id' => 'adsense-336-3',
  'description' => '336×280pxの広告を入力してください。',
  'before_widget' => '',
  'after_widget' => '',
  'before_title' => '<div class="widget-ad">',
  'after_title' => '</div>',
));

これで、 「広告 336×280-2」と「広告 336×280-3」の2つのウィジェットが追加されています。

「広告 336×280」と同じように、広告ユニットのコードを追加しておいてください。

手順2:追加したウィジェットを使うようにソースを修正する

次に、追加したウィジェットを使えるように、ソースを修正していきます。

親テーマのad-article-footer.phpを小テーマフォルダにコピーする

今回のカスタマイズは、ad-article-footer.phpというソースを修正していきます。

こちらも先ほどと同じような理由で、親テーマのソースを直接修正するのではなく、子テーマにコピーしてから、修正していきます。

親テーマのソースをそのままコピーすると、小テーマフォルダにあるソースが、優先的に使われるようになります。

子テーマフォルダのad-article-footer.phpを修正する

修正するのは2ヶ所です。

修正前

<div class="ad-left ad-pc adsense-336"><?php dynamic_sidebar('adsense-336');?></div>
<div class="ad-right ad-pc adsense-336"><?php dynamic_sidebar('adsense-336');?></div>

修正後

<div class="ad-left ad-pc adsense-336"><?php dynamic_sidebar('adsense-336-2');?></div>
<div class="ad-right ad-pc adsense-336"><?php dynamic_sidebar('adsense-336-3');?></div>

dynamic_sidebar(‘adsense-336-2‘)のように、ウィジェット追加の時に設定したidと一致させます。

カスタマイズ後の広告表示

カスタマイズ後の広告表示は次のようになります。

  • 1つ目のH2タグ見出しの上→広告 336×280ウィジェット
  • 記事本文下左側→広告 336×280-2ウィジェット
  • 記事本文下右側→広告 336×280-3ウィジェット

まとめ

今回のカスタマイズのポイントは、広告ユニットの追加を、直接ソース内に記載するのではなく、ウィジェットを追加して行ったところです。

これにより、別の広告ユニットを使いたい時でも、ウィジェット内の広告ユニットのコードを修正するだけで済みます。

今回はPCビューのみの修正です。スマホビューも同じような感じで修正すれば、複数の広告ユニットを使うことができます。2つまでは簡単にできますが、3つを違う広告ユニットにするのは、もう少しカスタマイズが必要になります。

スマホビューに関しては、もう少し検証してから記事にするかもしれません。
スマホについても記事にしました。

スマホ向けアドセンスにレスポンシブ広告をおすすめする理由
スマホ向けアドセンスにレスポンシブ広告をおすすめする理由
miyamoです。 SimplicityはGoogle Adsenseの広告設定が簡単にできるようになっています。 PC...

といいながら、まだこのブログには、Adsense広告を貼っていないのでした。

おしまい。miyamoでした。

スポンサーリンク

この記事がおもしろかったらシェアしてもらえると嬉しいです。

Twitterでのフォローお待ちしています。

コメント

  1. […] SimplicityでAdsenseの広告ユニットを個別にする方法 | 日刊すあろぐ! […]