ブログを収益化(マネタイズ)するため、AdSense(アドセンス)の広告の設定をしています。
すでに、WordPress(ワードプレス)で AdSense の広告の設定が済んでいますが、今回は「レクタングル」を「レスポンシブ」に置き換えてみます。
子テーマ「Simplicity2 child」の「有効」を確認
まずは WordPress で、設定されているテーマを確認しました。
もちろん以下のように、子テーマ「Simplicity2 child」を有効化してありました。


ウィジェットの広告の中を確認
以前 WordPress のウィジェット画面で設定した、広告ユニットコードを貼り付けるための領域を確認しました。

作業手順:
- サイドメニュー > 外観 > ウィジェット へと移動
- 「広告 336×280 」と「広告 300×250」に、それぞれ「カスタム HTML」が追加してあることを確認
- あとで広告ユニットコードを設定し直すため、この画面を開いたままの状態で維持
それぞれの「カスタム HTML」の中には、以前設定した「レクタングル(大)」と「レクタングル」の広告ユニットコードが記述してあります。
つぎにレスポンシブの広告ユニットの作成
Google AdSense(グーグル・アドセンス)で、次のようにして、広告ユニットを作成しました。
新しい広告ユニットの作成

作業手順:
- メニュー > 広告の設定 > 広告ユニット と移動
- 「+新しい広告ユニット」をクリック
作成する広告の種類の選択

作業手順:
- 「テキスト広告とディスプレイ広告」をクリック
広告の名前とサイズとタイプを指定
新しい広告ユニットの名前や広告サイズなどを決めます。

作業手順:
- 名前には、あとで見て分かるような名前を指定
- 広告サイズが、「自動サイズ レスポンシブ」であることを確認
- 広告タイプが、「テキスト広告とディスプレイ広告」であることを確認
- 「保存してコードを取得」ボタンをクリック
- 表示された「広告コード」ウィンドウで、広告コードをすべて選択してコピー
結果として「自動サイズ レスポンシブ」の広告ユニットコードが、コピーされました。
最後に、広告ユニットコードを貼り付け
WordPress に戻って、次のようにして、広告ユニットコードを貼り付けました。

作業手順:
- 「広告 336×280」の「カスタム HTML」をクリックして開く
- タイトルには、あとで見て分かるような名前を指定
- 内容には、先ほどコピーした「自動サイズ レスポンシブ」の広告ユニットコードを貼り付ける
- 「保存」ボタンをクリック
なお、同じ「自動サイズ レスポンシブ」の広告ユニットコードを「広告 300×250」の「カスタム HTML」にも、貼り付けました。
AdSense広告を設定するためには、「広告 336×280」と「広告 300×250」の両方の設定が必要です。
レスポンシブ広告の表示
ボクは、サイドバートップに広告を表示する設定にしています。
広告ユニットコードを「366×280 レクタングル(大)」や「300×250 レクタングル」から「自動サイズ レスポンシブ」に変えると、
パソコンでは、サイドバートップに表示されている広告が、「300×250 レクタングル」から「300×600 ラージ スカイスクレーパー」になっていました。
またモバイルでは、記事の下に表示されている広告が、広告の縦横の比率(アスペクト比)を維持したまま、横幅いっぱいまで拡大されました。
広告は、大きい方がクリック率が上がるので、このようなサイズになっているのだと思われます。
統計を取りたいとき(参考)

どの広告で成果があったのか、統計を取りたい場合には、次のようにします。
作業手順:
- Google で「広告 336×280」用の「自動サイズ レスポンシブ」の広告ユニットを作成し、そのコードをコピー
- WordPress で「広告 336×280」の「カスタム HTML」にコードを貼り付ける
- Google で「広告 300×250」用の「自動サイズ レスポンシブ」の広告ユニットを作成し、そのコードをコピー
- WordPress で「広告 300×250」と「カスタム HTML」にコードを貼り付ける
任意の場所に広告を置いて、統計を取りたい場合にも同様にします。
パフォーマンス追求広告の表示
サイドメニュー > カスタマイズ > 広告 で、「パフォーマンス追求広告の表示」にチェックをいれると、ウィジェット画面に「広告 320×100」と「広告 728×90」が追加されます。
追加で「広告 320×100」の広告ユニットコードを「320×100 ラージ モバイル バナー」から「自動サイズ レスポンシブ」に変えました。
サイドバートップに広告を表示する設定にすると、「広告 728×90」はどこにも表示されません。
レスポンシブ広告の調整
「広告 320×100」は、モバイル用の設定です。

「広告 320×100」の広告ユニットコードを「自動サイズ レスポンシブ」に変えると、最初は広告「300x280px レクタングル」が表示され、記事を下に押し下げてしまいました。
たしか、ポリシー違反のはずです。
そのままでは良くないので、レスポンシブ広告に高さを指定して、大きな広告で記事を下に押し下げないようにしました。
レスポンシブ広告の設定
WordPress で、次のようにして、広告ユニットコードを貼り付けました。

作業手順:
- 左側の利用できるウィジェットの中から「カスタム HTML」を「広告 320×100」に追加(追加対象をクリックすると、追加先を選択できます)
- 「広告 320×100」の「カスタム HTML」をクリックして開く
- タイトルには、あとで見て分かるような名前を指定
- 内容には、先ほどコピーした「自動サイズ レスポンシブ」の広告ユニットコードを貼り付ける
- 広告ユニットコードの insタグのスタイル(style)に、追加で高さを指定
<!-- 放浪J-レスポンシブ広告 --> <ins class="adsbygoogle" style="display:block; height:100px" ~></ins>
- 「保存」ボタンをクリック
この広告は、モバイルの記事の上に表示されます。
広告領域に『「テキスト」ウィジェットを用いて』と書いてありますが、「カスタム HTML」ウィジェットの使用をおすすめします。
レスポンシブ広告の表示
モバイルでは、記事の上に表示されている広告が、横幅いっぱいまで拡大されました。
サイズが決まっている広告の場合は、中央に表示されて両脇に隙間が空きます。
あとがき
レスポンシブ広告にすると全体的に、広告のサイズが大きくなるようです。
大きな広告は、クリック率が高くなるそうなので、取り入れたいところです。

ただ、もし大きな広告のせいで、間違えてクリックしてしまったとなると、問題です。
ブログを読んでくれている方の気分を害してしまいます。
最適な答えを見つけるため、いろいろと試行錯誤してみないといけませんね。
コメント