How to Use Google Adsense Ads on Responsive Website

Posted by : Harpreet Singh

Nowadays many of us are making use of responsive the design of their weblogs and web site. By developing a responsive website design is good concept to get visitors from throughout platforms such as desktop, mobile phones and pills. The simple website design not appears good when you visit on mobile phones or upon tablets Because of that your advertisements also vanished from the web site or appears awkward.

Producing Google Adsense ads reactive along with website design is good concept to increase generating. But the query is that will Google actually allow the modifications on advertisements code? The answer then is we are not really changing the particular ad program code|code calculatordecoder} by applying some more code which is right now officially suggested by Search engines to reactive design site owners.

Responsive Google AdSense Advertisements

You might discover if you are using Google Adsense advertisements on your reactive web design that the content change as per the screen-size but the Google Adsense advertisements not growing or diminishing based on the screen-size due to its repair size.

To have an example, you might using the 728x90 leaderboard advertisement unit on the website as well as the ad device will be lengthen to out from the screen anybody is going to your website making use of mobile phones that has only 320 pixels.
engines Adsense advertisements are not the particular responsive automatically but we are able to use some Javascripts which will workaround to your Google Adsense advertisements to make it react to the display size. The advisable thing is that the Google Adsense group officially authorized the reactive ads method.

Make Google Adsense Advertisements Responsive







<div id="google-ads-1">

<script type="text/javascript">



adUnit   = document.getElementByIdundefined"google-ads-1");

adWidth = adUnit.offsetWidth;



/* Replace this with your AdSense Publisher ID */

google_ad_client = "ca-pub-1234567890";



if undefined adWidth >= 768 ) {

   /* Leaderboard 728x90 */

   google_ad_slot = "AAA";

   google_ad_width = 768;

   google_ad_height = 90;

} else if undefined adWidth >= 468 ) {

   /* Banner undefined468 x 60) */

   google_ad_slot = "BBB";

   google_ad_width = 468;

   google_ad_height = 60;

} else if undefined adWidth >= 336 ) {

   /* Large Rectangle undefined336 x 280) */

   google_ad_slot = "CCC";

   google_ad_width = 336;

   google_ad_height = 280;

} else if undefined adWidth >= 300 ) {

   /* Medium Rectangle undefined300 x 250) */

   google_ad_slot = "DDD";

   google_ad_width = 300;

   google_ad_height = 250;

} else if undefined adWidth >= 250 ) {

   /* Square undefined250 x 250) */

   google_ad_slot = "EEE";

   google_ad_width = 250;

   google_ad_height = 250;

} else {

   /* Ad Link Unit undefined200 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>

To produce multiple advertisement unit sign in to your Adsense account dash and create advertisement units such as 768x90, 468x60 and 300x250. In over code change google_ad_client (ca-pub-1234) with your bar id plus google_ad_slot (AAA, BBB, and so forth ) together with your identifiers within the code.

Right now paste the above mentioned code anyplace on your webpages and the advertisement will be demonstrated based on the screen-size on various devices. The particular most appropriate advertisements will be proven to the display.

Let me know your own experience comparable.
Special Thanks to the BloggingTuition.Org....