Page Contents
Boost Adsense Earnings by placing ads size accordingly to screen size, Responsive ads.
Boost Adsense Earnings by placing the correct ad size ad on your webpage.

Responsive ad size: Responsive ad size means that the ad according to the size of the user’s display. If you place-responsive ad size then it will more user-friendly as well as boost your earning.
Higher CPC: Cost Per Click means average earning earned by one click. If you get a high CPC then your overall earning will be higher. Responsive ads size will get higher CPC than ‘auto’ ad sizes.
If you’re in fear of that, can you modify google AdSense ads size? Is it a violation of Google Policies? The answer is here.
Best Performing Ad sizes For Mobile
Width | Height | Can be placed at |
---|---|---|
300px | 250px | Above the fold |
336px | 280px | In Post/Article |
320px | 100px | above fold |
320px | 50 | above fold |
For Desktop/bigger screen
Width | Height | Can Place at |
---|---|---|
728px | 90px | In Article |
970px | 90px | bottom or front display |
468px | 60px | Below Menu |
300px | 600px | Sidebar |
How to Make an Ad Size Responsive?
Now you’ve almost any idea that what size of the ads to be placed and where to place. But the question here is. How to make an ad responsive for all screen?
Solution is here to Boost Adsense Earnings
<style>
.Techaak_responsive_1 {
width: 320px;
height: 100px;
}
@media(min-width:500px) {
.Techaak_responsive_1 {
width: 468px;
height: 60px;
}
}
@media(min-width:750px) {
.Techaak_responsive_1 {
width: 728px;
height: 90px;
}
}
</style>
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script><ins class="adsbygoogle Techaak_responsive_1" style="display:inline-block" data-ad-client="ca-pub-XXXXXXXXXXX" data-ad-slot="XXXXXX"></ins>
<script>(adsbygoogle = window.adsbygoogle || []).push({});</script>
Place above ad code by editing ‘red-coloured text’ by your values. and these changes are as
If your pages have more than 1 ad unit then, in place of 1st ad it will be Techaak_responsive_1 and for 2nd it will be Techaak_responsive_2 and similarly for 3rd Techaak_responsive_3.
Please make sure that you place all data-ad-slot
with the different ad unit. So that you can check report for all unit placed.
For Blogger(Advanced User)
Log in to blogger, click on a theme, and ‘edit HTML’ now find <style>
and place your style code before </style>
<style>
.Techaak_responsive_1 { width: 320px; height: 100px; }
@media(min-width: 500px) { .Techaak_responsive_1 { width: 468px; height: 60px; } }
@media(min-width: 750px) { .Techaak_responsive_1 { width: 728px; height: 90px; } }
.Techaak_responsive_2 { width: 320px; height: 100px; }
@media(min-width: 500px) { .Techaak_responsive_2 { width: 468px; height: 60px; } }
@media(min-width: 750px) { .Techaak_responsive_2 { width: 728px; height: 90px; } }
</style>
WordPress(Advance User)
WP user can edit there stylesheet by Clicking on appearance and then Editor. Now agree/understand the warning,(your own risk if you edited in the wrong way.). Placed your style code at the end of stylesheet. code will be like this.
<style>
.Techaak_responsive_1 { width: 320px; height: 100px; }
@media(min-width: 500px) { .Techaak_responsive_1 { width: 468px; height: 60px; } }
@media(min-width: 750px) { .Techaak_responsive_1 { width: 728px; height: 90px; } }
.Techaak_responsive_2 { width: 320px; height: 100px; }
@media(min-width: 500px) { .Techaak_responsive_2 { width: 468px; height: 60px; } }@media(min-width: 750px) { .Techaak_responsive_2 { width: 728px; height: 90px; } }
</style>
This method should help you in Boost Adsense Earnings. You can also check out this article about Google Adsense Payment Release
Tell us, how this article helps you. Or if you face any error, please comment below.