Cara Memasang Google Analytics di Blog AMP

Buat kamu yang kemarin sudah mencoba template VioMagz AMP versi 1.2 mungkin mengalami kesulitan dalam memasang kode-kode atau script. Kali ini saya akan membagikan cara memasang script dari Google Analytics di blog AMP.

Tutorial Google Analytics kali ini lebih menitik-beratkan pada Google Analytic Mobile dimana blog atau situs kita lebih banyak diakses oleh pengguna ponsel atau smartphone dibandingkan desktop PC.

Fungsi Google Analytics sendiri adalah untuk menampilkan statistik pengunjung dari halaman blog atau situs web kita. Hasil statistik dari Google Analytic jauh lebih lengkap jika dibandingkan dengan aplikasi sejenis seperti Jetpack (Wordpress) atau Histats.

Fitur Google Analytic sangat lengkap karena kita dapat mengetahui secara jelas dan rinci mengenai jumlah pengunjung, mesin pencari yang dipakai, sumber trafik, jaringan pay per click, dan lain sebagainya.

Sebenarnya untuk cara memasang Google Analytics di Blogspot sangat mudah karena kita cukup melakukan copy-paste script yang diberikan langsung pada template yang dipakai.

Tapi hal ini akan menjadi masalah tersendiri saat kita memakai template Blogger AMP. Kenapa? Karena kode dari Google Analytic berupa Javascript yang tentu saja tidak valid AMP test. Lalu bagaimana solusinya?

Memasang Kode Analytics

Dalam panduan ini saya menganggap kamu sudah memiliki Google Adsense Tracking Code. Siapkan kode tracking yang biasanya memakai format "UA-XXXXXXXX-XX".

Jika kamu sudah memasang script Google Analytics sebelumnya, silahkan hapus terlebih dahulu.

Bukalah dashboard Blogger dari blog atau situs kamu lalu masuk ke menu Theme - Edit HTML.

Carilah salah satu dari kode di bawah ini :

</head>
&lt;/head&gt;&lt;!--<head/>--&gt;
&lt;!--</head>--&gt;&lt;/head&gt;

Sekarang copy script di bawah ini tepat di atas atau sebelum kode yang kamu temukan :

<script async="async" custom-element="amp-analytics" src="https://cdn.ampproject.org/v0/amp-analytics-0.1.js"></script>

Perhatikan, jika pada template blog AMP yang kamu gunakan sudah terdapat kode atau script di atas, maka kamu tidak perlu menambahkannya lagi. Cukup satu saja.

Selanjutnya, scroll ke bagian bawah atau akhir dari script HTML template AMP kamu. Temukan salah satu kode berikut ini :

</body>
&lt;!--</body>--&gt;&lt;/body&gt;

Kode di atas biasanya terdapat pada baris kedua dari bawah. Jika sudah ketemu, copy paste script di bawah ini tepat di atas atau sebelum kode yang kamu temukan :

<!-- Google Analytics AMP by PenyuBiru.com -->
<amp-analytics type='googleanalytics'>
<script type='application/json'>
{
  "vars": {
    "account": "UA-XXXXXXXX-XX"
  },
  "triggers": {
    "trackPageview": {
      "on": "visible",
      "request": "pageview"
    }
  }
}
</script>
</amp-analytics>

Ganti nilai dari UA-XXXXXXXX-XX sesuai tracking code dari Google Analytics kamu.

Klik tombol Simpan lalu lihat hasilnya.