How to Setup Lazy Load for Google AdSense Ad units on Blogger

How to Setup Lazy Load for Google AdSense Ad units on Blogger

November 21, 2018


Google AdSense is a monetization program run by Google. It still the most reliable way to make money online for many publishers. One common problem publishers often face that Google AdSense affect our original blog speed. Due to not have control for optimizing resources, we just end up with feeling sad.
How to Setup Lazy Load for Google AdSense Ad units on Blogger


Instruction for Setup Lazy Loading for AdSense

  • First of all, remove below script from all ad units.
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>


  • After then, add below JavaScript code in your Theme Footer, possibly just before the </body> tag
<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>

NOTE: Noptimize tag is to make compatible with Autoptimize plugin. It will prevent aggregating AdSense lazy loader inline JS.

Honestly, I am not personally a huge fan of the lazy load even for images. But still, I just want to share an option. If you like, you may try once if you are highly concerned with serving primary content first, before Ad Units.

Load Comments