How to lazy load Adsense Ads on the Blogger website?

Copy

hi Dude, Welcome to our pixabin blog. let's see the topic "How to lazy load Adsense Ads on the Blogger website" on this blog. Adsense ad codes reduce the speed of the website when checking the speed of your website on websites like Google insight and GT Matrix. Optimizing all your Adsense ad codes is essential to fix this.

Just making a few changes to your website is enough to fix this. Optimize all Adsense ads on your website. This is called lazy load Adsense ads. So now before looking at how to install these lazy load Adsense ads on your website you need to know what this lazy load is.

What are Lazy load Adsense Ads?

Lazy load Adsense ads is a method of optimizing all the Adsense ads on your website. This will allow all Adsense ads on your website to load only after all the other elements on your website have loaded.

Also, when the pages of your website are scrolled, the ads in that area will be passed.

How its Works?

This script converts all Adsense ads on your website into lazyload Adsense ads. Thus only when all the ads in your website scroll through your website will the ads start to appear one by one. This will make your website more resource-intensive. So the composite speed of your website will definitely increase.

Pros and Cons on this Script

Pros

increase your website loading Speed
Reduce your website size
Get better ranking

Cons

Sometimes some ads was not shows
Reduce little bit of your income

if you want to download this lazy load Adsense ads Script on your Device. please hit the Download button & download "lazy load Adsense ads Script" into your Device.

Download

How to Setup lazy load Adsense ads on the Blogger

Step 1: Go to your blogger admin Dashboard and go to theme section
Step 2: First backup your theme and click Edit Html Option
Step 3: Next, Remove all previous Adsence Code on your Blogger theme like below

<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-xxxxxxxxxxxxxxxxxx"
     crossorigin="anonymous"></script>

Step 4: Next, Click Ctrl+F and Find </body> Tag.
Step 5: Copy the script below and Replace your Google Adsence Publisher ID( ca-pub-xxxxxxxxxxxxxxxx )
Step 6: paste it above the </body> tag.

<script type='text/javascript'>
//<![CDATA[
var lazyadsense2 = false;
window.addEventListener("scroll", function(){
if ((document.documentElement.scrollTop != 0 && lazyadsense2 === false) || (document.body.scrollTop != 0 && lazyadsense2 === false)) {
(function() { var ad = document.createElement('script'); ad.setAttribute('data-ad-client','ca-pub-xxxxxxxxxxxxxxxx'); ad.async = true; ad.src = 'https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js'; var sc = document.getElementsByTagName('script')[0]; sc.parentNode.insertBefore(ad, sc); })();
lazyadsense2 = true;
  }
}, true);
//]]>
</script>

Step 7: Do not forget to Save the theme
Step 8: Well done your Lazy load Adsense Ads Script is ready to Rock.

Custom Modifications

Modification 1

Go to blogger dashboard and Open Earnings Tag
Disconnect your Google AdSense on earning tab to after Setup lazy load Adsense ads Script on blogger.

Modification 2

Next, go to theme Section and click Edit HTML Option
remove previous adsense Code like below


<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-xxxxxxxxxxxxxxxxxx"
     crossorigin="anonymous"></script>

Modification 3

Remove the green section below all Google Adsense ad codes on the homepage, posts and pages of your website.

<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-8881158603467601"
     crossorigin="anonymous"></script>

<!-- Responsive Pixabin -->
<ins class="adsbygoogle"
     style="display:block"
     data-ad-client="ca-pub-xxxxxxxxxxxxxxxxx"
     data-ad-slot="xxxxxxxxxxx"
     data-ad-format="auto"
     data-full-width-responsive="true"></ins>
<script>
     (adsbygoogle = window.adsbygoogle || []).push({});
</script>

Once you have done this your Adsence Script will display as below.

Result like This 👇
<!-- Responsive Pixabin -->
<ins class="adsbygoogle"
     style="display:block"
     data-ad-client="ca-pub-xxxxxxxxxxxxxxxxx"
     data-ad-slot="xxxxxxxxxxx"
     data-ad-format="auto"
     data-full-width-responsive="true"></ins>
<script>
     (adsbygoogle = window.adsbygoogle || []).push({});
</script>

Important Note👇

You may think that making these changes on your website will cause any problems for your Adsense account. And there is no doubt that it is safe. The answer is that it is 100 percent safe. You can make these changes on your website without fear. This is because Google Adsense recommends optimizing the ads you use on your website. But one important thing. These changes need to be made carefully. Back up your website for more security.

Video Guide👇

Final Words

We are hopeful this topic "How to lazy load Adsense Ads on the Blogger website?" It absolutely helps to optimize your AdSense ads. If you face any problem with this script. Please contact us. One more thing please follow my blog on Google News and share this Article. Thank you for reading.

Pixabin Official