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

miyamoです。

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

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

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

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

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

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

photo by Katie Brady

1 Simplicityの設定
- 1.1 レイアウト（全体・リスト）の設定
- 1.2 広告の設定
2 手順１：広告ユニットを貼るウィジェットを増やす
- 2.1 親テーマのfunction.phpを見てみる
- 2.2 Adsense広告ユニット用のウィジェットを2つ追加する
3 手順２：追加したウィジェットを使うようにソースを修正する
4 まとめ

Simplicityの設定

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

レイアウト（全体・リスト）の設定

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

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

広告の設定

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

収益面からも、H2見出し手前に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」と同じように、広告ユニットのコードを追加しておいてください。

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

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

親テーマの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と一致させます。