Adsense Responsive Ads Guide For Coding

Adsense Responsive Ads Guide For Coding is for the publishers of normal AdSense account and using or thinking to use a responsive design.There are some codings. Previously, it was normal not to modify the AdSense Ad code – we advocated to use DoubleClick for Publishers for normal AdSense account holders who wanted a control based on API. Now, AdSense allows some Acceptable modifications for normal AdSense Account holders too. That is what we will explain in this guide on Adsense Responsive Ads Guide For Coding.

Adsense Responsive Ads Guide For Coding : Basics of the basics

For this guide on Adsense Responsive Ads Guide For Coding, we are fully following this official guide :

We can not be held responsible for any wrong thing you have done and you got banned out of either your misunderstandings with this guide on Adsense Responsive Ads Guide For Coding or for any change in Google’s policy. We recommend to create and modify one Ad unit and test it on a non public webpage. Your account will never get banned if you deliver the Ads through DoubleClick as you are not directly modifying AdSense unit. However the coding part is more difficult.

As basically Ads are not like other HTML units which we control with CSS, for example, you can test any responsive website with our responsive testing tool; you will notice that the elements can actually change in size or position. But in case of AdSense Ad units, you have to supply another smaller unit. It is a kind of ‘virtual responsiveness’.

Adsense Responsive Ads Guide For Coding

A normal AdSense unit’s code looks like this :

We are actually adding these :
width = document.documentElement.clientWidth;google_ad_slot = "1234567890";google_ad_width = 320;google_ad_height = 50;if (width > 500) {google_ad_slot = "3456789012";google_ad_width = 468;google_ad_height = 60;}if (width > 800) {google_ad_slot = "2345678901";google_ad_width = 728;google_ad_height = 90;}
In place of :

google_ad_slot = "7031491000";google_ad_width = 728;google_ad_height = 90;

For the above code. So first extra line is mandatory :

width = document.documentElement.clientWidth;

Secondly, the first set :

google_ad_slot = "1234567890";google_ad_width = 320;google_ad_height = 50;

Is the primary unit. We are adding logical part within {} :

if (width > 800) {google_ad_slot = "2345678901";google_ad_width = 728;google_ad_height = 90;}

That simply means :

Normally show the first unit, if the device has >800 pixels wide and >500 pixels wide display, show our defined units. You must close the ( ) and { } within a set. In other words, default will be the smallest Ad unit on that design part. When it becomes >800, it will show the ‘normal’ desktop version. So for example, create three units and start to modify the most small unit’s code.

Alternatively, you can actually call via “Setting custom channels dynamically”. The code becomes :

var channel_condition = object.booleanMethod();google_ad_client = "ca-publisher-id";google_ad_slot = "1234567890";google_ad_width = 728;google_ad_height = 90;if (channel_condition){google_ad_channel = 123457789;} else {google_ad_channel = 263477489;}

This last method for creating Adsense Responsive Ads are for advanced users. Because basically you need some understanding of (channel_condition) argument.