How to Customize Google Adsense Async Responsive ADS Size

0 44

Customize adsense responsive ads to earn more from the same traffic you receive
Adsense responsive ads are greater way to display ads on sites with responsive design, but responsive ads will show custom ads they usually pay less but they can be customized to show recommended ad sizes which tends to pay more so customizing responsive ads are very important if you totally rely on Adsense as a publisher…

This article guides how to customize your Adsense responsive ads, first you have to generate an Adsense adunit

<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- ADUnit -->
<ins class="adsbygoogle"
 style="display:block"
 data-ad-client="ca-pub-xxxxxx"
 data-ad-slot="yyyyyy"
 data-ad-format="auto"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>

Here is an example of Adsense asynchronous responsive Adunit, this will automatically check the width available for Ad and show a suitable Ad size automatically, but responsive ad sizes may differ & they can be any size which aren’t even listed on Adsense Guide to ad sizes, so customizing them to show the recommended most successful ad sizes are very important

How to Customize Responsive ads to show a specific size according to available width

<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>

As you are going to use the asynchronous Adcodes, just include the above script once in the head section of your HTML

Here is an example of Header Ad, usually its better to use 320×100 and 728×90 but you can also use 468×60 which is  a better size for tablets

<style>
.headerad { width: 320px; height: 100px; }
@media(min-width: 468px) { .headerad { width: 468px; height: 60px; } }
@media(min-width: 728px) { .headerad { width: 728px; height: 90px; } }
</style>
<!-- Header Ad -->
<ins class="adsbygoogle headerad"
 style="display:inline-block"
 data-ad-client="ca-pub-xxxx"
 data-ad-slot="yyyy"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>

For screen widths up to 467 a 320×100 sized Mobile large banner will be served
For screen widths between 468 to 727 a 468×60 sized Banner will be served
for all other screen 728×90 Leaderboard ad will be served

Mobile large banner and Leaderboard sizes are most recommended anyhow 468×60 ad will be a good choice for medium sized tablets

Here is an example for sidebar ads

<style>
.sidebarad { width: 300px; height: 250px; }
@media(min-width: 336px) { .sidebarad { width: 336px; height: 280px; } }
</style>
<!-- Sidebar Ad -->
<ins class="adsbygoogle sidebarad"
 style="display:inline-block"
 data-ad-client="ca-pub-xxxx"
 data-ad-slot="yyyy"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>

For screen widths up to 335 a 300×250 sized Medium Rectangle ad will be served
For all other screen widths a 336×280 sized Large Rectangle ad will be served

Here are some other ways how a responsive adunit can be customized but using the following methods are not recommended

<ins class="adsbygoogle"
 style="display:block;"
 data-ad-client="ca-pub-xxxx"
 data-ad-slot="yyy"
 data-ad-format="horizontal"></ins>
<script>(adsbygoogle = window.adsbygoogle || []).push({});</script>
<ins class="adsbygoogle"
 style="display:block;"
 data-ad-client="ca-pub-xxxx"
 data-ad-slot="yyy"
 data-ad-format="vertical"></ins>
<script>(adsbygoogle = window.adsbygoogle || []).push({});</script>
<ins class="adsbygoogle"
 style="display:block;"
 data-ad-client="ca-pub-xxxx"
 data-ad-slot="yyy"
 data-ad-format="rectangle"></ins>
<script>(adsbygoogle = window.adsbygoogle || []).push({});</script>

In the all three examples above data-ad-format are different it can be configured as
Horizontal, Vertical and Rectangle.
Here are some Horizontal, Vertical and Rectangle famous ad sizes but you can see Google recommends only few ad sizes better stick with them

Horizontal Adsense Banners
728×90 is best for Desktops, 468×60 Recommended for Tablets with Smaller Screen Size where 728 ads won’t fix, 320×100 Ad size is Best for Mobile
Vertical Adsense Banners
Vertical Adsense Banners, 160×600 performs very well when compared to 300×600 but google is just trying to make Large Skyscraper famous
Rectangle Adsense Banners
Rectangle Adsense Banners, 300×250 ad units perform very well than 336×280 ads

Leave A Reply