Cách thêm Analytics cho website mới nhất

Cách thêm Analytics cho website mới nhất

Khi bạn kiểm tra website của bạn bằng PageSpeed Insights bị nó cảnh báo thì chắc chắn các bạn sẽ đi tìm cách khắc phục nó đúng không nào ? Hướng dẫn dưới đây của mình chắc chắn sẽ khắc phục được vấn đề đó:

Khi bạn tạo mới và chèn mã theo dõi Google Analytics cho website của bạn, Google sẽ cung cấp bạn một đoạn mã tương tự như mẫu dưới đây
  
      <!-- Global site tag (gtag.js) - Google Analytics -->
  <script async="" src="https://www.googletagmanager.com/gtag/js?id=UA-XXXXXXXXX-1"></script>
  <script>
    window.dataLayer = window.dataLayer || [];
    function gtag(){dataLayer.push(arguments);}
    gtag('js', new Date());
    gtag('config', 'UA-XXXXXXXXX-1');
  </script>
    
  
Google hướng dẫn chèn đoạn mã đó trước thẻ đóng </head>, nhưng thật ra bạn cũng có thể chèn mã dưới cùng trước thẻ đóng </body> cũng được. Tuy nhiên cho dù bạn chèn trước </head> hay trước </body> cũng đều gây ảnh hưởng đến thời gian tải trang.

Dành cho các nền tảng khác không phải Blogspot:

Các bạn chỉ cần dán đoạn Javascript này trước thẻ </body> là được nhé:
  
    
     <script>
      window.addEventListener('load', function() {
          var is_load = 0
          function loadanalytics() {
              if (is_load == 0) {
                  is_load = 1
                  var an = document.createElement('script')
                  an.async = true;
                  an.src = 'https://www.googletagmanager.com/gtag/js?id=UA-XXXXXXXXX-1'
                  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', 'UA-XXXXXXXXX-1');
              }
          }
          window.addEventListener('scroll', function() {
              loadanalytics()
          })
      })
  </script>
    
  
Lưu ý: Đoạn bôi đỏ là mã theo dõi của Analytics mà bạn được Google cung cấp ở trên !

Dành cho nền tảng Blogspot

Mặc định trong template, Blogger cũng cung cấp sẵn thẻ dữ liệu mặc định Google Analytics, thẻ này có tên:
  
      <b:include data='blog' name='google-analytics'/>
    
  

Nếu bạn kiểm tra trong template đã có sẵn thẻ này, bạn chỉ cần lấy ID theo dõi và chèn nó trong Cài đặt > Khác > Google Analytics > ID thuộc tính web Analytics

Để không làm ảnh hưởng đến hiệu suất trang, sau khi bạn đã chèn ID thuộc tính web Analytics trong cài đặt, bạn vào chỉnh sửa chủ đề tìm thẻ dữ liệu Google Analytics và xóa nó đi, xong bạn chèn lại mã trước thẻ đóng </body> như sau:
  
      <b:if cond='data:blog.analyticsAccountNumber'>
    <script>
      var analyticsAccountNumber="<data:blog.analyticsAccountNumber/>"
    //<![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>
    
  
Sử dụng phương pháp scroll chặn tải script ngay khi trang tải, chỉ khi nào người dùng scroll mới bắt đầu load script. Ngoài ra nếu bạn để trống ID thuộc tính web Analytics trong cài đặt đoạn script sẽ không được tải.

Đọc thêm

6 nhận xét

  1. Md Mijanur Rahaman (MR)
    Your site is beautiful to look at and the articles are also very useful. Thank you very much.
    You Can see our article .
    MR Laboratory
    How to lock facebook profile
    Top 5 ways to earn income online
    How to Install the Yoast SEO Plugin for Blogger Blog । SEO Tricks
    YouTube's secret tips and tricks. Best Hacks for You
    https://www.mrlaboratory.info
    80
  2. Mohammed Gulam Rabbi
    This is a very helpful website. We can find our needy post or tips from this site . I think it is essential for us.


  3. Nguyễn Lâm Blog
    ước đc liên kết blog :<
    • Lê Vạn Bảo Trọng
      blog trên 100k view với domain .tk nhé, còn .com .net auto liên kết
  4. Themerum
    liên kết nhé bác.
    https://www.themerum.com ạ
    Mô tả: Free Premium Blogger Template Theme Blog WordPress

Comments Facebook