How to add Lazyload Google analytics code to Blogger website? [speed up your Blog]

You can easily lazy load the Google analytics code in blogger and solve render-blocking problem.

Google Analytics is one of the most used javascript codes on a Website and may cause a render-blocking effect while loading the webpage. 

Lazyload Google analytics code in Blogger

You can easily Lazyload the Google analytics code on the Blogger website by following this guide. 

How does Google analytics Affect Page speed?

Google Analytics is a free tracking tool by Google and it gives you complete information on how visitors use your website.

But, it can slow down your blog loading time if it is not properly implemented. Generally, Google Analytics adds up to 3 HTTP requests and takes around 100 milliseconds to 500 milliseconds. 

You can easily save this time by delaying the load of the Analytics code. 

Do you know you can improve page load 100 milliseconds faster by putting the analytics code in Footer instead of the header.  It can solve eliminate PageSpeed render-blocking Javascript and above-the-fold content errors. 

But, you can further improve the page speed by lazyloading the analytics code in your website. 

How To Install Lazy loaded Google Analytics code in Blogger?

#1: Go to Blogger setting page and remove the Google Analytics property ID. 

#2: Now go to the theme section and create a backup of your theme. 

#3: Now click on edit HTML and search for old analytics code if any and remove it. 

So generally, the script installation will look like this. 

<script async='async' src='https://www.googletagmanager.com/gtag/js?id=UA-xxxxxxx-x'/>
<script>
//<![CDATA[
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());
  gtag('config', 'UA-xxxxxxx-x');
//]]>
</script>

#4: Just remove the highlighted part and add the below script just above it. 

<script type='text/javascript'>//<![CDATA[
var lazyanalisis=!1;window.addEventListener("scroll",function(){(0!=document.documentElement.scrollTop&&!1===lazyanalisis||0!=document.body.scrollTop&&!1===lazyanalisis)&&(!function(){var e=document.createElement("script");e.type="text/javascript",e.async=!0,e.src="https://www.googletagmanager.com/gtag/js?id=UA-xxxxxxxxxx";var a=document.getElementsByTagName("script")[0];a.parentNode.insertBefore(e,a)}(),lazyanalisis=!0)},!0);
//]]></script>

#5: Here replace the tracking code (highlighted) in both of the codes and paste it just above the </body> tag. 

Download This code. 

You have to wait 25 seconds.

Generating Download Link...


Now save your theme and the lazy analytics code is added to your blogger website. Now check your analytics code, if it is properly working or not. 

In this way, you can install google analytics code to blogger and improve the loading speed. 

Video Guide 

Disadvantage of Lazyload Google Analytics

Implementing Lazyload of Analytics code in the Website can impact your analytics data. It will not be able to track views if a user closes the page before a complete load of a page. 

But, it is completely fine as it makes no sense to track a user that doesn't even load the page completely. 

Here, also note that the subsequent visit of a user will not impact the analytics data as it has already cached in the browser. 

That's why I strongly recommend you implement Lazyloading of Analytics code in your blogger website. 

Conclusion

Now, you learn how to improve page loading speed in blogger by lazyloading the Analytics code. If you have any doubt regarding this you can ask me in the comment section. 

You can also improve blogger loading speed by following these resources. 
You can also check more Tutorials in our Blogging guide section.