Reputation: 844
With media query, I set the Div to display:none
which contains AdSense code. However, I wanted to show another AdSense Ad which is in another DiV with display:block
.
Need your help in understanding the below:
Does display:none
will prevent sending the Ad request to Google or prevent it from downloading the AD from Google?
My challenge, the last I wanted to show will be fourth AdSense Ad and I cannot show 4 ads as per AdSense policy.
Upvotes: 1
Views: 634
Reputation: 2176
display:none
on parent div
does not prevent ad request from that ad unit:
<div style="display:none">
<ins class="adsbygoogle adslot_1" ... ></ins>
</div>
That is a violation of AdSense policy about hiding ads: "Hiding ad units at anytime (e.g., display:none
), unless you're implementing a responsive ad unit."
To prevent ad request, we need to apply display:none
on AdSense ins
tag:
<style type="text/css">
.adslot_1 { display: inline-block; width: 320px; height: 50px; }
@media (max-width: 400px) { .adslot_1 { display: none; } }
@media (min-width: 500px) { .adslot_1 { width: 468px; height: 60px; } }
@media (min-width: 800px) { .adslot_1 { width: 728px; height: 90px; } }
</style>
<ins class="adsbygoogle adslot_1"
data-ad-client="ca-pub-1234"
data-ad-slot="5678"></ins>
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<script>(adsbygoogle = window.adsbygoogle || []).push({});</script>
That is "Hiding an ad unit" advanced feature. For the viewport less than 401px, above example will inject <!--No ad requested because of display:none on the adsbygoogle tag-->
comment inside ins
tag (instead of the advertisement).
I think my "How to 'move' AdSense ads" JSFiddle example is probably what you want - "I wanted to show another AdSense Ad which is in another DiV with display:block
". (Move vertical border to see ads "moving".)
Upvotes: 2