ブログ広告もスマホ対応！アドセンスをレスポンシブで表示させる方法

スマホ普及に伴いアドセンスもPCとスマホ、それぞれの画面サイズにあった広告を表示できる機能が追加されました。アドセンスのレスポンシブ広告の設定について紹介していきます。複雑なphpを使わずにアドセンスコードのみでできるので非常に便利で簡単になりました！

1.　広告ユニットの作成

まずは広告ユニットの作成からしていきます。下記のとおりに進むと新しい広告ユニット作成の画面にたどり着きます。

①　広告の設定　＞　②　＋新しい広告ユニットの作成

• 名前：わかりやすいように名前をつけておきます。（例：サイト名＋記事上＜広告配置場所＞）
• 広告サイズ：　レスポンシブを選択してください。最近ですと自動的に１番最初に表示されます。
• 広告タイプ：テキスト広告とディスプレイ広告がよくお薦めされています。（両方の広告タイプですと幅広く広告が表示されるようになります。）
• テキスト広告のスタイル：運営サイトの色合いと馴染むようにするとクリック率がアップします。とりあえずはデフォルトでOKです。後ほどABテストを繰り返して適した色合いを見つけるといいです。

最後に保存してコードを取得。をクリックする。

それぞれの箇所の広告ユニットを作成していきましょう。

1. モアタグ用
2. 記事中
3. 記事下

※１つの広告ユニットをサイト内で使い回すと、どの広告場所が一番クリックされているのかがわからなくなります。収益アップの分析するためにもそれぞれ作成していくことをおすすめします。

→記事ごとのアドセンスデータを見る方法はこちらより。

 

2. 広告コードを編集する

広告コードを取得したら、１箇所だけ修正します。

【修正前】data-ad-format=”auto”
↓
【修正後】data-ad-format=”rectangle”

 

“auto”のままですと、PCで表示した際に横帯状の広告が表示されますで、よりクリック率の高い正方形で表示されるように設定します。

実際に貼り付けするコードはこのようになります。

 

 

手持ちiPhoneで確認してみると、画面からはみ出していた広告が画面内にきちんとおさまるようになりました！

before：レスポンシブ前

↓

after：レスポンシブ後

 

アドセンス広告の配置については以下の記事をご参照ください。
→ショートコードを使い広告を表示させる方法！
→クリック率の高い配置パターンは？
→記事下に広告を表示させたい！
→記事中にモアタグを使ってアドセンスを簡単に設置！

 

まとめ

私のアドセンスのデバイス別データを見てみると、High-end mobile device(スマホ)が90％以上を占めています。次に多いのが、（といっても赤の8.3％）PCになります。

ほぼスマホ。スマホ優先のサイトを作ってもいいぐらいですよね。それぐらいスマホが普及している、ということで、便利になったアドセンスのレスポンシブ広告を使っていきましょう！

ひまりこメルマガ

アドセンス累計1,000万円以上稼いできたブログの作り方をまとめました♪