How to Hide AdSense Ads on your Website

Enter a reason for deleting this comment

How to Hide AdSense Ads on your Website

google AdSense supports resposive ads which means that the size of AdSense ads on your website will automatically change based on the visitor’s device. Thus, if they are viewing your pages on a desktop computer, they may be served the bigger 728×90 leaderboard while the same ad unit may serve a smaller 468×60 banner to visitors who are on a tablet.

There’s no need to change the code as the AdSense script smartly detects the browser’s width and serves the right size accordingly.

Now consider a slightly different scenario where, instead of showing a smaller sized ad, you would like to completely hide the AdSense ad if the screen width is less than ‘n’ pixels. For instance, you may have a 160×600 px Skyscraper unit in your website’s sidebar but it should be displayed only when the site is being viewed on a desktop computer and not on a mobile phone.

There are two ways to achieve this. You can either write a CSS media query that will completely hide the sidebar on a mobile phone and thus the included AdSense ad will also be hidden from the visitor. This will however be against adsense program policy because the AdSense ad will still be rendered on the visitor’s screen though hidden from view.

How to Hide AdSense Ads with CSS Media Queries
What we therefore need is a mechanism where the the AdSense ad is itself ‘blocked’ from rendering on a small screen. This is also possible with CSS media queries but the big difference is that we need to apply the CSS rules to the ad element and not the parent container (which in our case is the sidebar). Let me explain:

How to Hide AdSense Ads on your Website

What you see above is a standard AdSense code snippet that will render a 160×600 pixels ad unit. The size (height and width) of the ad is specified as an inline style.

If you copy-paste the above ad unit as is into your website, it will always download and render the ad irrespective of the visitor’s screen size. If you however need to prevent the AdSense ad from showing on small screens, we need to make a few officially permitted changes to the default code.

The modified code will look something like this:

How to Hide AdSense Ads on your Website

If you carefully notice the two snippets, you’ll find that we’ve added a new classsidebar_ads (you can give it any name) to the default AdSense snippet. Next we’ve added a media query that will hide all elements of this class if the screen width is less than 480 pixels. That’t it.

With this approach, no ad requests is made to the Google server and thus no ad is shown to the visitor. The ad area will be hidden and the content below will get pushed up leaving no whitespace, just as you’d like it to be.


Please login or sign up to leave a comment


why you want hide adsense code?
so, you will not get money, friend

Are you sure you want to delete this post?


That’s also my understanding when you tweak your web page to hid the Adsense ads. What if Adsense would find out that a web page or probably web pages in your site are hiding the ads that Adsense placed? Don’t you think your site will be sanctioned? I am asking this because you have posted the codes on how to block the ads. But my question is the consequence if the site is sanctioned.

Are you sure you want to delete this post?


Really amazing information lets see whether its working or not ?

Are you sure you want to delete this post?


I am not into coding, however, I am interested in learning coding. Thanks for this valuable lesson. Having ads on your website does not mean you will automatically earn money. Your ads need to be clicked. In order to get your ads clicked you must optimize ads for your web page. Sometimes we may want to hide adsense ad. Thanks for this valuable lesson.

Are you sure you want to delete this post?