Ditulis oleh: Ditulis pada: 5/30/2020
Amp-analytics Untuk Google Analytics Dengan gtag.js - Dengan kode yang saya bagikan ini, maka amp-analytics akan lebih mendukung Global Site Tag.
Sebelumnya kita sudah mengenal kode amp-analytics untuk Google Analytics untuk halaman AMP yang umum digunakan seperti berikut ini:
<amp-analytics id='analytics1' type='googleanalytics'>
<script type='application/json'>
{
"vars": {
"account": "UA-xxxxxxx-x"
},
"triggers": {
"trackPageview": {
"on": "visible",
"request": "pageview"
}
}
}
</script>
</amp-analytics>
Namun saat ini Google Analytics secara default menggunakan Global Site Tag (gtag.js), jadi amp-analytics yang digunakan pun harus ikut menyesuaikan.
Google Analytics dengan Global Site Tag (gtag.js)
Untuk Google Analytics dengan Global Site Tag (gtag.js) ini bisa dengan mudah kita ketahui dari kode tracking Google Analytics, biasanya akan seperti ini.
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-xxxxxx-x"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'UA-xxxxxx-x');
</script>
Amp-analytics dengan gtag.js
Jika kode Google Analytics untuk blog Anda seperti kode di atas yaitu dengan gtag.js, maka kode amp-analytics untuk halaman blog AMP Anda sebaiknya menggunakan kode berikut di bawah ini.
<amp-analytics data-credentials='include' type='gtag'>
<script type='application/json'>
{
"vars" : {
"gtag_id": "UA-xxxxxx-x",
"config" : {
"UA-xxxxxx-x": { "groups": "default" }
}
}
}
</script>
</amp-analytics>
Silahkan ganti kode yang ditandai dengan ID Google Analytics blog Anda. Dan pastikan blog Anda sudah menggunakan js amp-analytics seperti di bawah ini.
<script async='async' custom-element='amp-analytics' src='https://cdn.ampproject.org/v0/amp-analytics-0.1.js'/>
Untuk lebih jelasnya bisa dipelajari di sini: Tambahkan Analytics ke halaman AMP.