の投稿で、スマートフォン時の広告表示を改善いたしました。
その影響を受け、PC でページを見た時も広告の表示が変わってしまいました。変わること自体は問題ではありませんけれども、広告収益に変化があった時に、PC の表示が変わったからなのか、スマートフォンの表示が変わったからなのか、わかりません。
これではいけませんね。
そこで、レスポンシブ広告の設定を見直しましたら、PC での表示は今までどおりの「300× 250 – レクタングル(中)」にすることができましたのでノートいたしますわ。
レスポンシブ広告ユニットの広告サイズ調整♪
何はともあれやってみましょう。今まで、細長くなる前は 300× 250 – レクタングル(中)でしたので、スマートフォン以外の次の2箇所を 300× 250 に修正してみます。
具体的には次の2行のサイズを変更します。
- @media(min-width: 500px)
- @media(min-width: 800px)
修正して、次のようになりました。スマートフォン用の広告サイズを変更する前と同じように表示できました。とってもいい感じ♪ですの♪
<style> .my_adslot { width: 290px; height: 50px; } @media(min-width: 500px) { .my_adslot { width: 300px; height: 250px; } } @media(min-width: 800px) { .my_adslot { width: 300px; height: 250px; } } </style> <script async src="http://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script> <!-- レスポンシブ --> <ins class="adsbygoogle my_adslot" style="display:inline-block" data-ad-client="ca-pub-XXXXXXXXXXXXXXXX" data-ad-slot="YYYYYYYYYY"></ins> <script> (adsbygoogle = window.adsbygoogle || []).push({}); </script> <hr>
ちなみに、修正前の細長い広告表示はこれですわ。
<style> .my_adslot { width: 290px; height: 50px; } @media(min-width: 500px) { .my_adslot { width: 468px; height: 60px; } } @media(min-width: 800px) { .my_adslot { width: 728px; height: 90px; } } </style> <script async src="http://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script> <!-- レスポンシブ --> <ins class="adsbygoogle my_adslot" style="display:inline-block" data-ad-client="ca-pub-XXXXXXXXXXXXXXXX" data-ad-slot="YYYYYYYYYY"></ins> <script> (adsbygoogle = window.adsbygoogle || []).push({}); </script> <hr>
おわりに
これで、スマートフォンの広告サイズを変更した事による広告収益への影響のみを図ることができますの♪
楽しみですわ。
以上です。