In this article, I will let you know How To Lazyload Google Analytics In Blogger and WordPress? According to Core Web Vitals page speed is also a ranking factor, and lazyload is the best way to optimize the page load speed.
Google Analytics is a JavaScript code which runs on every page of the site and it may display render-blocking issue while checking page speed in the PageSpeed Insights tool by Google.
How To Lazyload Google Analytics Code In Blogger?
Disclosure: Some of the links to products in this article are affiliate links. It simply means, at no additional cost to you, we’ll earn a commission if you click through and buy any product.
Step 1: Log in to your Blogger Dashboard > Take a Backup
Step 2: Navigate to Settings > Remove Google Analytics Property ID > Save
Step 3: Go to Theme > Edit HTML
Step 4: Search For Analytics (Remove google analytics code if it is available) [Might be available near <head> or </head>]
Step 5: Log in to your Google Analytics Account > Choose the site > Admin > Tracking info > Tracking Code > Copy the code
It will look like this
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-*********-*"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'UA-*********-*');
</script>
Step 6: Replace <script async src=”https://www.googletagmanager.com/gtag/js?id=UA-*********-*”></script> in your Google Analytics code with below Code
Step 7: In the below code change the Tracking Code UA-*********-* with your Google Analytics tracking code
<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-*********-*";var a=document.getElementsByTagName("script")[0];a.parentNode.insertBefore(e,a)}(),lazyanalisis=!0)},!0);
//]]></script>
Step 8: Paste the code above </body> > Save
Your final code will look like this, instead of doing replacement in above codes just change the Tracking Code in below tag with yours and paste it before </body>.
<!-- Global site tag (gtag.js) - Google Analytics -->
<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-*********-*";var a=document.getElementsByTagName("script")[0];a.parentNode.insertBefore(e,a)}(),lazyanalisis=!0)},!0);
//]]></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'UA-*********-*');
</script>
How To Lazyload Google Analytics Code In WordPress?
Step 1: Log in to your WordPress Dashboard
Step 2: Use any cache plugin (WP Rocket)
Step 3: Go to WP Rocket Setting > File Optimization > Delay JavaScript execution of Google Analytics
Step 4: Save changes
If you don’t have WP Rocket you can follow the Blogger method and paste it in the head section with the help of any plugin.
Wrap Up
I hope this article would be useful for you to add Lazyload google analytics in Blogger and WordPress in the simplest way. I use these methods to add Lazyload Google Analytics to speed up your website and rank your website higher than the competitor.
Happy Blogging!