ボクのアフィリエイト日記

ボクアフィ

AdSense

AdSenseのレイアウトが崩れる(表示がずれる)原因と対処法

更新日:

AdSenseのレイアウトが崩れたときの解決策

AdSenseの「記事内広告」や「レスポンシブ広告」のレイアウトが崩れている(表示がずれる)ときは、全幅サイズ表示の無効化で修正できる場合があります。

この記事で具体的な記述方法などを解説します。

レイアウトが崩れているAdSenseの例

レイアウトが崩れているAdSenseの例

NG例

レイアウトが崩れていないAdSenseの例

OK例

パソコンでは問題ないけれど、スマートフォンなどの端末で閲覧したときに、上画像(左)のようにAdSenseがコンテンツの左(または右)にはみ出てしまうことがあります。

ボクの場合は、

  • 記事内広告
  • レスポンシブ広告
  • 関連コンテンツ

などの全幅サイズの広告ユニットで、レイアウトが崩れる現象を確認できました。

記事内広告は、広告内に「もっと見る」ボタンが表示されますが、そのボタンも正しく表記されませんでした。

AdSenseのレイアウトが崩れる原因

AdSenseのレイアウトが崩れる原因は、自動的に画面の幅いっぱいに展開しようとする広告ユニットです。テーマなどサイトの環境と、AdSenseの相性が良くないときに、レイアウトが崩れるようです。

Googleが行ったテストの結果では、自動的に画面の幅いっぱいに展開させた方が収益性が上がるようですが、レイアウトが崩れるようなら収益性は下がります。すぐに直しましょう。

レイアウトが崩れたときの解決策

AdSenseのレイアウトが崩れたときの修正コード

修正コードと記述位置

AdSenseのレイアウトがコンテンツの左または右に寄ってレイアウトが崩れる場合、全幅サイズ表示の無効化で修正できる可能性があります。

記事内広告でこの表示方法(自動的に画面幅いっぱいに展開)を使用したくない場合は、広告コードを変更することで無効化できます。ただし、収益拡大の機会を逃す結果となる可能性もありますのでご留意ください。

出典:https://support.google.com/adsense/answer/7569699

実際、ボクのAdSense広告はこの方法ですべて解決しました。

AdSenseヘルプにもありますが、以下のコードを追加してください。

data-full-width-responsive="false"

「data-ad-slot=」の下に「data-full-width-responsive="false"」を追加することで、全幅サイズ表示を無効化できます。

コードを追記したら、改めて表示を確認してみましょう。

まとめ

AdSenseがコンテンツからはみ出て表示されてしまうときは、全幅サイズ表示の無効化で修正できる可能性があります。

全幅サイズ表示の無効化は、ご自身のAdSenseコードの「data-ad-slot=」の下に、「data-full-width-responsive="false"」の1行を追加します。コードを間違えると思わぬトラブルを生むので、気を付けてくださいね。

参考サイト

この記事の作成にあたり、以下のサイトを参考にしました。

[広告]

WordPressテーマ
AFFINGER5(WING)

AFFINGER5

「AFFINGER5(WING)」は、SEO対策広告収入UPの機能が標準装備されたWordPressテーマ。

決して安いテーマではありませんが、使いこなせば値段以上の価値があり、あなたの財産となります。

もっと詳しく

-AdSense

Copyright© ボクアフィ , 2019 All Rights Reserved.