[GA4] Menyiapkan konfigurasi manual (Tag Manager)

This feature is part of an open beta and is subject to change.

Petunjuk ini ditujukan bagi administrator dan editor yang ingin mengidentifikasi data yang disediakan pengguna di situs mereka dan memasukkan data tersebut ke Google Tag Manager.

Ringkasan

Anda harus memperbarui kode di setiap halaman tempat Anda mengumpulkan data yang disediakan pengguna, seperti halaman pendaftaran, halaman perolehan prospek, halaman checkout, atau halaman yang serupa. Anda dapat mengirimkan data lebih dari sekali dalam satu sesi untuk memastikan data tersebut dikirim ke Analytics.

Sebelum memulai

Petunjuk ini mengasumsikan bahwa Anda telah:

• Memiliki akses ke penampung Tag Manager untuk situs Anda
• Mengaktifkan pengumpulan data yang disediakan pengguna dan mengizinkan penyertaan data yang disediakan pengguna
• Menyiapkan tag Google Analytics: Peristiwa GA4 di penampung Tag Manager

 Petunjuk

1. Login ke Google Tag Manager.
2. Dari tab Ruang kerja, klik Tag di sebelah kiri.
3. Buka tag Google Analytics: Peristiwa GA4 tempat Anda mengumpulkan data pelanggan.
4. Pilih Sertakan data yang disediakan pengguna dari situs Anda.
   
5. Di menu drop-down Data Pengguna, pilih atau buat variabel Data yang Disediakan Pengguna.
6. Pada variabel Data yang Disediakan Pengguna, pilih Konfigurasi manual.
   
7. Untuk setiap kolom, luaskan menu drop-down, lalu pilih variabel.
8. Jika Anda membuat variabel untuk kolom data, selesaikan langkah-langkah berikut:
   1. Klik Konfigurasi Variabel > Elemen DOM.
   2. Masukkan nama untuk variabel di bagian atas.
   3. Di kolom Metode Pemilihan, pilih Pemilih CSS.
   4. Di kolom Pemilih Elemen, masukkan pemilih CSS yang merujuk ke data pelanggan. Pelajari cara mengidentifikasi pemilih CSS untuk kolom data yang disediakan pengguna.
   5. Biarkan kolom Nama Atribut kosong.
   6. Lewati kolom Nilai Format untuk menghindari potensi masalah penyiapan.
   7. Simpan variabel Elemen DOM.
   8. Ulangi langkah-langkah tersebut untuk setiap kolom yang ingin Anda kumpulkan.
9. Pada variabel Data yang Disediakan Pengguna, lewati kolom Nilai Format.
10. Simpan tag peristiwa.
11. Di kanan atas, klik Kirim untuk memublikasikan perubahan.

Identify CSS selectors for user-provided data fields

To identify the CSS selectors to input into the fields, complete these steps for each field. If you already have unhashed variables in your code, you can select those instead of creating new CSS variables. Learn more about Fields to set.

Note: If you’re using JavaScript variables, it’s likely easiest to ask your developer which variables should be added to these fields. If you’re using CSS Selectors, you can follow the steps below.

1. Open a Google Chrome browser window.
2. Go to your website, but keep Google Tag Manager open.
3. Identify the customer data you want to send to Google Analytics. For example, if you want to send an email address, identify where the email address is present on the page.
4. Right click the field and select Inspect. For example, if you are trying to capture an email address, make sure you are right clicking the email address.
5. On the Chrome Developer Tools page, you will see a portion of the code highlighted. This code is the page element where you need to extract CSS Selectors for the customer data.
6. Hover your mouse over the highlighted code and right-click it.
7. Scroll down to "Copy", then select Copy Selector.
8. Paste the copied text in the corresponding field in Google Analytics or Tag Manager.
   • The copied text should look something like the following:

     tsf > div:nth-child(2) > div.A8SBwf > div.RNNXgb > div > div.a4bIc > custEmail

Next steps

Validate that user-provided data collection is set up correctly. Show me how.