How To Make AdSense Code Responsive

Yes, you read it right. Now you can make your Adsense ads responsive. Google Adsense ads are not responsive but you can make them by using the JavaScript code. This trick is first founded by Amit Aggarwal of freresponsivedesign.com. The good news is that Google Adsense has accepted to use this JavaScript!

Making Your AdSense Code Responsive – Approved Trick

Make Ad units of all sizes, i.e 768×90, 468×60 and 300×250.

Paste the below JavaScript code where you want to appear your responsive ad.

<!– You can add multiple Adsense Ad units –>
<!– Just change the ad on Line #4 and Line #7 –>

<div id=”google-ads-1″>

adUnit = document.getElementById(“google-ads-1″);
adWidth = adUnit.offsetWidth;

/* Replace this with your AdSense Publisher ID */
google_ad_client = “ca-pub-1234567890“;

if ( adWidth >= 768 ) {
/* Leaderboard 728×90 */
google_ad_slot = “AAA“;
google_ad_width = 768;
google_ad_height = 90;
} else if ( adWidth >= 468 ) {
/* Banner (468 x 60) */
google_ad_slot = “BBB“;
google_ad_width = 468;
google_ad_height = 60;
} else if ( adWidth >= 336 ) {
/* Large Rectangle (336 x 280) */
google_ad_slot = “CCC“;
google_ad_width = 336;
google_ad_height = 280;
} else if ( adWidth >= 300 ) {
/* Medium Rectangle (300 x 250) */
google_ad_slot = “DDD“;
google_ad_width = 300;
google_ad_height = 250;
} else if ( adWidth >= 250 ) {
/* Square (250 x 250) */
google_ad_slot = “EEE“;
google_ad_width = 250;
google_ad_height = 250;
} else {
/* Ad Link Unit (200 x 90) */
google_ad_slot = “FFF”;
google_ad_width = 200;
google_ad_height = 90;
}
</script>

<script type=”text/javascript”
src=”http://pagead2.googlesyndication.com/pagead/show_ads.js”>
</script>
</div>

Now change the ca-pub-1234567890 with your publisher ID.

Also change the ad slots with yours. The Ad slots are seen in your Adsense codes.

that’s It! If you have doubts, need help or something went wrong then please don’t hesitate to comment below. Please share with your friends if you liked it and found it helpful.

Related Posts: