Lazy loading AdSense ads can dramatically give a speed boost to your blog or website in a similar way like the lazy loading of images script does to your blog. So the whole point here is when the user lands on your blog or website, the adsense ads are not going to load until he scrolls the window, as soon as he scrolls the adsense ads script will load and show all the ads on your blog. This definitely helps you in getting speedy blog or website as the ads are not loaded hence the speed is going to be great.
Now performance wise I cannot claim if its going to reduce your earnings or not, but yes speed boost is definitely seen when implementing this script. You can try using this trick to increase your blog speed, in case you find that the earnings are not accurate or something is not good then you can anytime revert back to normal script, as we are not fiddling with any of your blog script so nothing to worry about.
How to Install Lazy Load AdSense Ads on Blogger
Now below steps are given to lazy load your adsense ads on your blogger blog, but the same can be implemented on your WordPress or any other static site. I would definitely recommend you to try this trick, this might really help you in getting a much faster blog or website. If earnings your issue then you can try different methods to increase your adsense earnings, like auto implementing adsense ads right after the MORE tag or split post option. And even sticking your ads to scroll when user scrolls through your content could also help you in getting those extra impressions.
- Open Blogger > Theme > Edit HTML.
- Now you need to make sure that you remove any Google Ad script from your blog, the script looks like below, so you need to remove any of those lines else, the script will load instantly as the way it was loading earlier.
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script> - So after you have removed this script you need to search for
</body>or<!--</body>--></body>and you need to paste below script below any of these code.<script type='text/javascript'> //<![CDATA[ // Lazy Load AdSense var lazyadsense=!1;window.addEventListener("scroll",function(){(0!=document.documentElement.scrollTop&&!1===lazyadsense||0!=document.body.scrollTop&&!1===lazyadsense)&&(!function(){var e=document.createElement("script");e.type="text/javascript",e.async=!0,e.src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js";var a=document.getElementsByTagName("script")[0];a.parentNode.insertBefore(e,a)}(),lazyadsense=!0)},!0); //]]> </script> - After you have pasted just Save your Template and reload your blog to see the desired effect, simply scroll and see the ads loading automatically.
You will for sure see some serious effects on your blog or websites speed after implementing this script, if case you are wondering adding adsense codes right inside your HTML and they are not getting accepted, you need to use the adsense code converter to convert your code and then it is going to be accepted in your HTML, you can try that, so guys I hope this tutorial works for you, make sure to comment below in case you find any difficulties using this script.
(COMMENTS WILL LOAD AUTOMATICALLY)