Panduan ini akan memandu Anda melalui langkah-langkah untuk membuat template variabel kustom. Saat digunakan, variabel ini akan mengambil array nilai dan menampilkannya sebagai string yang dipisahkan koma.
Untuk memulai template variabel pertama Anda, klik Template di navigasi sebelah kiri, lalu klik tombol Baru di bagian Template Variabel.
Di tab Info, tentukan Nama dan Deskripsi variabel.
Nama adalah apa yang akan ditampilkan kepada pengguna saat mereka menerapkan variabel ini di seluruh antarmuka pengguna Tag Manager.
Deskripsi adalah persis seperti namanya - deskripsi singkat (200 karakter atau kurang) tentang fungsi variabel ini.
Klik Refresh untuk melihat pratinjau template Anda.
Di sebelah kanan input kolom, ada jendela Pratinjau Template. Setiap kali perubahan dibuat dalam editor, tombol Refresh akan muncul. Klik Refresh untuk melihat apa yang dilakukan perubahan pada tampilan variabel Anda.
Klik Kolom untuk menambahkan kolom ke template variabel Anda.
Tab Kolom Editor Template memungkinkan Anda membuat dan mengedit kolom di template variabel. Kolom digunakan untuk memasukkan data kustom, seperti ID akun. Anda dapat menambahkan elemen formulir standar seperti kolom teks, menu drop-down, tombol pilihan, dan kotak centang.
Klik Tambahkan Kolom dan pilih Tabel sederhana. Ganti nama default (misalnya, "simpleTable1") dengan "daftar". Di Pratinjau Template, klik Refresh.
Ulangi langkah ini untuk Input Teks dan beri nama "array", dua Kotak centang yang disebut "use_array" dan "sort", serta Input Teks yang disebut "delimiter". Untuk "delimiter", berikan nilai default "," dengan mengklik ikon roda gigi, alihkan "Nilai default" ke aktif, lalu isi kolom input Nilai Default yang baru.
Klik tab Kode dan masukkan JavaScript dengan sandbox di editor:
var input = data.array; if (!data.use_array) { input = []; for (var i = 0; i < data.list.length; i++) { input.push(data.list[i].values); } } if (data.sort) { input.sort(); } return input.join(data.delimiter || ',');
Kode untuk variabel ini cukup sederhana, tetapi ada beberapa hal yang penting untuk dijelaskan.
Kolom
data
.Ada beberapa kolom yang sedang diakses dari
data
global.data
akan berisi nilai yang Anda siapkan di langkah sebelumnya. Itulah sebabnya kita dapat mengaksesdata.use_array
,data.sort
,data.list
, dandata.delimiter
.delimiter
ditetapkan ke nilai default","
jikadata.delimiter
tidak diberikan. Sebaiknya tetapkan nilai default untuk kolom jika memungkinkan. Hal ini memudahkan pengguna untuk menggunakan template variabel, karena mereka tidak perlu mengisi setiap kolom untuk menggunakan variabel.
Klik Simpan untuk menyimpan progres. Tindakan ini akan memuat izin yang terdeteksi ke Editor Template.
Beberapa API Template memiliki izin yang dikaitkan dengannya yang menentukan fungsi yang dapat atau tidak dapat dilakukannya. Saat Anda menggunakan API template seperti
sendPixel
di kode Anda, Tag Manager akan menampilkan izin yang relevan di tab Izin.Di tab Pratinjau Template, tambahkan beberapa nilai untuk input "nilai", klik Jalankan Kode, dan lihat Konsol untuk melihat output untuk variabel Anda.
Jika ada error, error tersebut akan muncul di jendela Konsol.
Klik Simpan, lalu tutup Editor Template
Template variabel kini telah siap digunakan.