Cara Memasang Heatmap dengan Google Tag Manager (Tanpa Edit Kode, 5 Menit)

Ringkasan

Dengan GTM, Anda bisa memasang heatmap tanpa menyentuh kode situs sama sekali

Lima langkah: buat tag Custom HTML → pasang trigger All Pages → publish

Tanda keberhasilan adalah angka yang bergerak di dashboard HeatMapX Anda — bukan sekadar "tidak ada error"

Jika situs Anda sudah mengelola tag melalui Google Tag Manager (GTM), inilah cara paling rapi untuk menambahkan pelacakan heatmap: semuanya dilakukan di antarmuka GTM, tanpa perubahan kode sama sekali. Panduan ini menjelaskannya langkah demi langkah.

Sebelum mulai: dapatkan site key Anda

Daftar di HeatMapX (ada paket gratis, tidak perlu kartu kredit), daftarkan situs Anda, dan Anda akan mendapatkan site key.

Setelah Anda memilikinya, Anda akan menggunakan tag berbentuk seperti ini — ganti YOUR-SITE-KEY dengan key Anda yang sebenarnya:

<script src="https://heatmapx.com/tracker.js?key=YOUR-SITE-KEY" data-site-key="YOUR-SITE-KEY"></script>

Penting: tempelkan seluruh tag, bukan hanya URL-nya. Atribut data-site-key="..." memberi tahu HeatMapX situs mana yang memiliki data ini — jika Anda menghapusnya, atau hanya menempel URL src, tidak ada data yang akan terlacak.

Pengaturan di GTM (5 langkah)

Buka konsol GTM (tagmanager.google.com) dan pilih container (workspace) situs Anda
Buka "Tags" → "New" di menu kiri, lalu pilih "Custom HTML" sebagai jenis tag
Tempelkan seluruh tag di atas ke kolom HTML
Pada bagian triggering, pilih "All Pages (Page View)", beri nama yang mudah dikenali untuk tag ini (mis. HeatMapX), lalu simpan
Klik "Submit / Publish" di kanan atas untuk menerapkan perubahan secara langsung

Selesai — pelacakan sekarang berjalan di setiap halaman situs Anda.

Ingin memeriksa sebelum publish? (Mode Preview)

Klik "Preview" di GTM untuk menguji tag di browser Anda sendiri sebelum go-live. Buka situs Anda melalui layar preview (Tag Assistant) — jika tag HeatMapX Anda muncul di bawah "Fired", berarti sudah berfungsi.

Jika tag tidak fire — checklist

Sudahkah Anda menekan Publish? Menyimpan saja tidak menerapkan perubahan secara langsung. Ini penyebab paling umum
Apakah trigger-nya All Pages? Trigger khusus halaman tertentu berarti halaman lain tidak akan terlacak
Apakah banner persetujuan cookie (consent mode) memblokirnya? Dengan beberapa alat manajemen persetujuan, tag Custom HTML ditahan sampai pengunjung memberi persetujuan. Periksa pengaturan consent pada tag dan bagaimana CMP Anda mengategorikannya
Apakah data-site-key sudah benar? Menempel key milik situs lain akan mengirim data Anda ke situs yang salah

Biarkan Claude Code memandu Anda

Jika Anda tidak ingin repot menelusuri antarmuka GTM, Anda bisa meminta agen AI seperti Claude Code untuk memandu Anda. Salin prompt di bawah ini, ganti dengan site key Anda sendiri, lalu tempelkan.

I want to deploy the HeatMapX heatmap tracking tag via Google Tag Manager.
Walk me through the GTM interface one step at a time, waiting for my reply at each step.

The tag to use (Custom HTML, All Pages trigger):
<script src="https://heatmapx.com/tracker.js?key=YOUR-SITE-KEY" data-site-key="YOUR-SITE-KEY"></script>

Jika Anda tidak menggunakan GTM dan ingin memasang tag langsung di kode situs Anda, versi ini memungkinkan Claude Code melakukan perubahan file untuk Anda:

Install the HeatMapX heatmap tracking tag in this project.
Make sure the following tag is included right before </head> on every page, and tell me which files you changed.

<script src="https://heatmapx.com/tracker.js?key=YOUR-SITE-KEY" data-site-key="YOUR-SITE-KEY"></script>

HeatMapX dirancang agar pengambilan dan analisis data Anda juga bisa dilakukan dari Claude Code (integrasi CLI) — lihat halaman "CLI & Skills" di dashboard Anda setelah semuanya terpasang.

Verifikasi cara kerjanya: angkanya harus bergerak

Setelah pemasangan, jelajahi beberapa halaman di situs Anda sendiri, lalu buka dashboard HeatMapX Anda. Jika "Sessions today" untuk situs Anda terus bertambah, berarti pelacakan sudah aktif.

Tanda keberhasilan bukanlah "tidak ada error" — melainkan angka yang bergerak di dashboard. Jika tidak ada yang bergerak, telusuri checklist di atas secara berurutan.