Minify javascript google analytics blogger

 You are having problems with website performance, page loads slower after inserting google analytics tracking ID into blogspot . When you test a website with Pagespeed you are warned, you are looking for a way to insert google analytics code into blogspot without making the page load slowly. My guide below will help you.

When you create a new and insert the google analytics tracking code in the blogspot template theme , Google will provide you with a snippet similar to the sample below.


<!-- Global site tag (gtag.js) - Google Analytics -->

<script async="" src="https://www.googletagmanager.com/gtag/js?id=UA-156685272-1"></script>

<script>

  window.dataLayer = window.dataLayer || [];

  function gtag(){dataLayer.push(arguments);}

  gtag('js', new Date());

  gtag('config', 'UA-156685272-1');

</script>

Google instructs to insert that code before the closing </head> tag , but actually you can also insert the bottom code before the closing </body> tag However, whether you pre-insert </head> or before </body> will affect the page load time.

By default in the template, Blogger also provides a default Google Analytics data tag, which has the name:


<b:include data='blog' name='google-analytics'/>

If you check in the template that this tag already exists, you just need to get the tracking ID and insert it in Settings> More> Google Analytics> Analytics web property ID.

In order not to affect page performance, after you have inserted the Analytics web property ID in the settings, go to edit the topic to find the Google Analytics data tag and delete it, then re-insert the code before the closing tag < / body> is as follows:


<b:if cond='data:blog.analyticsAccountNumber'> <script> var analyticsAccountNumber=&quot;<data:blog.analyticsAccountNumber/>&quot; //<![CDATA[ var fired=false window.addEventListener('scroll',function(){ if((document.documentElement.scrollTop!=0&&fired===false)||(document.body.scrollTop!=0&&fired===false)){ (function(){ var an=document.createElement('script') an.async=true;an.src='https://www.googletagmanager.com/gtag/js?id='+analyticsAccountNumber var sc=document.getElementsByTagName('script')[0] sc.parentNode.insertBefore(an,sc) })(); window.dataLayer=window.dataLayer||[] function gtag(){dataLayer.push(arguments)} gtag('js', new Date()) gtag('config',analyticsAccountNumber) fired=true } },true) //]]></script> </b:if>

Using the scroll method prevents script loading as soon as the page loads, only when the user scrolls to start loading the script. Also if you leave the Analytics web property ID blank in the settings the script won't load.