Pengantar ga.js (Lama)

ga.js adalah library JavaScript untuk mengukur cara pengguna berinteraksi dengan situs Anda. Ini adalah library lama. Jika Anda akan memulai Google Analytics, Anda harus menggunakan library pelacakan terbaru, analytics.js.

Panduan Memulai Kode Pelacakan

Cuplikan Analytics adalah potongan kecil kode JavaScript yang Anda tempelkan ke halaman. Tindakan ini mengaktifkan pelacakan Google Analytics dengan memasukkan ga.js ke dalam halaman. Untuk menggunakannya di halaman Anda, salin cuplikan kode di bawah, dengan mengganti UA-XXXXX-X dengan ID properti web Anda. Tempel cuplikan ini ke halaman template situs Anda agar muncul sebelum tag </head> penutup.

Jika perlu melakukan lebih dari sekadar pelacakan halaman dasar, lihat referensi pelacakan untuk mengetahui daftar metode yang tersedia di API, dan lihat Panduan Penggunaan untuk mengetahui detail tentang penggunaan sintaksis asinkron. Untuk petunjuk langkah demi langkah tentang cara menyiapkan pelacakan, lihat artikel Pusat Bantuan tentang menyiapkan pelacakan. 

<script type="text/javascript">

  var _gaq = _gaq || [];
  _gaq.push(['_setAccount', 'UA-XXXXX-X']);
  _gaq.push(['_trackPageview']);

  (function() {
    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
  })();

</script>

Cuplikan di atas mewakili konfigurasi minimum yang diperlukan untuk melacak halaman secara asinkron. Metode ini menggunakan _setAccount untuk menetapkan ID properti web halaman, lalu memanggil _trackPageview untuk mengirim data pelacakan kembali ke server Google Analytics.

Penting: Jika Anda memperbarui halaman dari cuplikan tradisional ke versi asinkron terbaru, Anda harus menghapus cuplikan pelacakan yang ada terlebih dahulu. Sebaiknya jangan gunakan kedua cuplikan secara bersamaan di halaman yang sama. Untuk petunjuk migrasi, lihat Bermigrasi ke Asinkron.

Cara Kerja Sintaksis Asinkron

Objek _gaq adalah yang membuat sintaksis asinkron dimungkinkan. Fungsi ini bertindak sebagai antrean, yang merupakan struktur data pertama masuk,pertama keluar yang mengumpulkan panggilan API sampai ga.js siap mengeksekusinya. Untuk menambahkan sesuatu ke antrean, gunakan metode _gaq.push.

Untuk mengirim panggilan API ke antrean, Anda harus mengonversinya dari sintaksis JavaScript tradisional menjadi array perintah. Array perintah hanyalah array JavaScript yang sesuai dengan format tertentu. Elemen pertama dalam array perintah adalah nama metode objek pelacak yang ingin Anda panggil. Harus berupa string. Elemen lainnya adalah argumen yang ingin Anda teruskan ke metode objek pelacak. ID ini dapat berupa nilai JavaScript apa pun.

Kode berikut memanggil _trackPageview() menggunakan sintaksis tradisional:

var pageTracker = _gat._getTracker('UA-XXXXX-X');
pageTracker._trackPageview();

Kode yang setara dalam sintaksis asinkron memerlukan dua panggilan ke _gaq.push.

_gaq.push(['_setAccount', 'UA-XXXXX-X']);
_gaq.push(['_trackPageview']);

Dalam sintaksis asinkron, pembuatan objek pelacak bersifat tersirat, tetapi kita masih memerlukan cara untuk menetapkan ID properti web untuk pelacak. Metode _setAccount telah ditambahkan untuk menyediakan kemampuan ini. Semua metode objek pelacak lainnya sama dalam pelacakan asinkron dan tradisional. Hanya sintaksisnya yang berbeda.

Untuk mengetahui informasi selengkapnya tentang sintaksis asinkron, lihat Referensi Pelacakan untuk metode _gaq.push.

Kembali ke Atas

Pelacakan dengan Pengendali Peristiwa HTML

Sintaksis pelacakan asinkron juga harus digunakan dari dalam pengendali peristiwa DOM. Misalnya, tombol berikut menghasilkan peristiwa saat diklik. 

<button onclick="_gaq.push(['_trackEvent', 'button3', 'clicked'])"></button>

Meskipun tombol ini diklik sebelum browser selesai memuat ga.js, peristiwa akan direkam dan pada akhirnya dijalankan. Dengan pelacakan tradisional, browser mungkin menampilkan pengecualian dalam situasi ini.

Kembali ke Atas

Mendorong Fungsi ke Antrean

Selain array perintah, Anda juga dapat mengirim objek fungsi ke antrean _gaq. Fungsi ini dapat berisi JavaScript arbitrer apa pun dan seperti array perintah, fungsi tersebut akan dijalankan sesuai urutan pengirimannya ke _gaq. Teknik ini berguna untuk memanggil API pelacakan yang menampilkan nilai. Misalnya, kode berikut membuat URL penaut dan menetapkan properti href untuk link dengan hasilnya. 

_gaq.push(function() {
  var pageTracker = _gat._getTracker('UA-XXXXX-X');
  var link = document.getElementById('my-link-id');
  link.href = pageTracker._getLinkerUrl('http://example.com/');
});

Contoh di atas menggunakan _gat untuk membuat objek pelacak, tetapi karena telah ditetapkan ke variabel lokal, kode di luar fungsi tidak dapat menggunakannya. Meskipun ini dapat diterima, Anda dapat menggunakan metode _gat._createTracker untuk membuat objek permanen yang dapat diakses secara global. Kode berikut menunjukkan cara kerjanya. 

_gaq.push(function() {
  var pageTracker = _gat._createTracker('UA-XXXXX-X', 'myTracker');
  var link = document.getElementById('my-link-id');
  link.href = pageTracker._getLinkerUrl('http://example.com/');
});

_gaq.push(['myTracker._trackPageview']);

Contoh di atas membuat pelacak asinkron di dalam fungsi, lalu mereferensikannya nanti berdasarkan nama dalam array perintah.

Kasus penggunaan sebaliknya juga dapat terjadi. Misalnya, jika Anda perlu menggunakan objek pelacak asinkron yang dibuat melalui array perintah yang dikirim sebelumnya, gunakan metode _gat._getTrackerByName. Kode berikut menunjukkan cara kerjanya. 

_gaq.push(['myTracker._setAccount', 'UA-XXXXX-X']);

_gaq.push(function() {
  var pageTracker = _gat._getTrackerByName('myTracker');
  var link = document.getElementById('my-link-id');
  link.href = pageTracker._getLinkerUrl('http://example.com/');
});

Kembali ke Atas

Sekali Dorong, Banyak Perintah

Daripada mengetik _gaq.push(...) untuk setiap panggilan, Anda dapat mengirim semua perintah sekaligus. Kode berikut menunjukkan teknik ini. 

_gaq.push(
  ['_setAccount', 'UA-XXXXX-X'],
  ['_setDomainName', 'example.com'],
  ['_setCustomVar', 1, 'Section', 'Life & Style', 3],
  ['_trackPageview']
);

Ini berfungsi karena metode _gaq.push meniru metode Array.push, yang memungkinkan pengiriman beberapa item dengan satu pemanggilan.

Kembali ke Atas

Memisahkan Cuplikan

Jika memilih untuk menempatkan cuplikan Analytics di bagian bawah halaman, Anda harus tahu bahwa Anda tidak harus menempatkan seluruh cuplikan di bagian bawah. Anda tetap dapat mempertahankan sebagian besar manfaat pemuatan asinkron dengan membagi cuplikan menjadi dua; biarkan paruh pertama berada di bagian atas halaman dan pindahkan sisanya ke bagian bawah. Karena bagian pertama cuplikan pelacakan tidak terlalu berpengaruh atau tidak berpengaruh pada rendering halaman, Anda dapat membiarkan bagian tersebut di atas dan meletakkan bagian cuplikan yang menyisipkan ga.js di bagian bawah.

Halaman dengan cuplikan asinkron yang dibagi menjadi dua mungkin terlihat seperti ini: 

<html>

<head>
  <script type="text/javascript">
    var _gaq = _gaq || [];
    _gaq.push(['_setAccount', 'UA-XXXXX-X']);
    _gaq.push(['_trackPageview']);
  </script>
</head>

<body>
  <p>Page Content</p>

  <script src="some_random_script.js"></script>

  <p>Page Content</p>

  <script type="text/javascript">  (function() {
    var ga = document.createElement('script');     ga.type = 'text/javascript'; ga.async = true;
    ga.src = ('https:'   == document.location.protocol ? 'https://ssl'   : 'http://www') + '.google-analytics.com/ga.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
    })();
   </script>
</body>
</html>

Kedua bagian kode harus digabungkan dalam tag skripnya sendiri, tetapi hanya enam baris terakhir dari cuplikan asinkron asli yang perlu dipindahkan ke bagian bawah. Semua baris yang mengirim metode ke _gaq dapat tetap berada di atas.

Kembali ke Atas

Menghindari Perangkap Umum

Saat menggunakan sintaksis asinkron atau tradisional, perhatikan hal-hal berikut:

  • Nama metode peka huruf besar/kecil.
    Jika Anda menggunakan nama metode tanpa kapitalisasi yang tepat, panggilan metode Anda tidak akan berfungsi. Contoh: 
    _gaq.push(['_trackpageview']);   // bad
_gaq.push(['_trackPageview']);   // good
  • Gunakan nama metode yang benar.
    Jika pelacakan tidak berfungsi dengan benar, periksa untuk memastikan Anda menggunakan nama yang benar untuk metode tersebut. Contoh: 
    _gaq.push(['_setDomain', 'example.com']);       // bad
_gaq.push(['_setDomainName', 'example.com']);   // good
  • Hanya string yang harus diteruskan dengan tanda kutip. Semua jenis lainnya tidak boleh dikutip.
    Setiap nilai yang bukan string, seperti boolean, literal objek, fungsi, atau array, harus diteruskan tanpa tanda kutip. Hanya gunakan tanda kutip saat Anda meneruskan sesuatu yang dimaksudkan untuk ditafsirkan sebagai string. Jika Anda bermigrasi dari sintaksis tradisional, parameter fungsi apa pun yang diteruskan tanpa tanda kutip harus tetap tidak dikutip dalam sintaksis asinkron. Contoh: 
    _gaq.push(['_setAllowLinker', 'false']);    // bad
_gaq.push(['_setAllowLinker', false]);      // good
  • Pastikan string tidak berisi spasi kosong di awal atau akhir.
    Contoh: 
    _gaq.push(['_setAccount', ' UA-65432-1']);    // bad
_gaq.push(['_setAccount', 'UA-65432-1']);     // good

Kembali ke Atas

Menonaktifkan Pelacakan

Dalam beberapa kasus, Anda mungkin perlu menonaktifkan kode pelacakan Google Analytics di halaman tanpa harus menghapus cuplikan kodenya. Misalnya, Anda dapat melakukannya jika kebijakan privasi situs menyertakan kemampuan pengunjung untuk memilih tidak ikut dalam pelacakan Google Analytics.

Cuplikan pelacakan ga.js kini menyertakan properti jendela, yang jika ditetapkan ke true, akan menonaktifkan cuplikan pelacakan agar tidak mengirim data ke Google Analytics. Saat Google Analytics mencoba menetapkan cookie atau mengirim data kembali ke server Google Analytics, Google Analytics akan memeriksa apakah properti ini ditetapkan ke true. Jika ya, pengunjung akan memiliki efek yang sama seperti jika pengunjung telah menginstal Plugin Browser Penyisih Google Analytics.

Untuk menonaktifkan pelacakan, tetapkan properti jendela berikut ke benar (true):

window['ga-disable-UA-XXXXXX-Y'] = true;

Dalam hal ini, nilai UA-XXXXXX-Y sesuai dengan ID properti web tempat Anda ingin menonaktifkan pelacakan.

Properti jendela ini harus ditetapkan sebelum kode pelacakan dipanggil. Properti ini harus ditetapkan di setiap halaman tempat Anda ingin menonaktifkan pelacakan Google Analytics. Jika properti tidak ditetapkan atau ditetapkan ke false, pelacakan akan berfungsi seperti biasa.

Jadi, misalnya, jika kode pelacakan Google Analytics Anda di halaman menyertakan:

_gaq.push['_setAccount', 'UA-123456-1']

Dan Anda ingin menonaktifkan kode pelacakan tersebut agar tidak menetapkan cookie atau mengirim data kembali ke Google Analytics, Anda menggunakan kode berikut sebelum kode pelacakan dipanggil:

window['ga-disable-UA-123456-1'] = true;

Jika menggunakan beberapa pelacak di halaman dengan beberapa ID properti web, Anda harus menetapkan variabel window['ga-disable-UA-XXXXXX-Y'] yang setara ke true untuk setiap properti web agar dapat sepenuhnya menonaktifkan pelacakan Google Analytics di halaman tersebut.

Contoh

Berikut contoh sederhana beberapa kode yang dapat Anda gunakan untuk menyediakan fungsi ketidakikutsertaan bagi pengguna.

Pertama, tambahkan link HTML baru ke situs Anda untuk menjalankan logika pilihan tidak ikut:

<a href="javascript:gaOptout()">Click here to opt-out of Google Analytics</a>

Lalu, tambahkan cuplikan kode berikut sebelum cuplikan kode ga.js. Pastikan untuk mengganti nilai gaProperty dari UA-XXXX-Y ke properti yang digunakan di situs Anda. Nilai ini sama dengan yang Anda teruskan ke perintah _setAccount.

<script>
// Set to the same value as the web property used on the site
var gaProperty = 'UA-XXXX-Y';

// Disable tracking if the opt-out cookie exists.
var disableStr = 'ga-disable-' + gaProperty;
if (document.cookie.indexOf(disableStr + '=true') > -1) {
  window[disableStr] = true;
}

// Opt-out function
function gaOptout() {
  document.cookie = disableStr + '=true; expires=Thu, 31 Dec 2099 23:59:59 UTC; path=/';
  window[disableStr] = true;
}
</script>

Saat pengguna mengklik link HTML pilihan tidak ikut, fungsi gaOptout kustom akan dijalankan. Tindakan ini akan menetapkan cookie untuk waktu yang lama di masa mendatang dan menonaktifkan pengumpulan data analytics.js. Saat pengguna kembali ke situs ini, skrip di atas akan memeriksa apakah cookie ketidakikutsertaan telah ditetapkan. Jika ya, pengumpulan data analytics.js juga akan dinonaktifkan.

Memaksa SSL (HTTPS)

Untuk memaksa Google Analytics agar selalu mengirim data menggunakan SSL, bahkan dari halaman yang tidak aman (HTTP), gunakan metode _gat._forceSSL, seperti dalam contoh ini:

_gaq.push(['_setAccount', 'UA-12345-1']);
_gaq.push(['_gat._forceSSL']);       // Send all hits using SSL, even from insecure (HTTP) pages.
_gaq.push(['_trackPageview']);

Kembali ke Atas