Cara Melacak Pengiriman Formulir Elementor di Acara Google Analytics menggunakan JQuery
Saya telah mengerjakan situs WordPress klien selama beberapa minggu terakhir yang memiliki beberapa kerumitan. Mereka menggunakan WordPress dengan integrasi ke ActiveCampaign untuk memelihara lead dan a Zapier integrasi ke Jual Zendesk melalui Formulir Elemen. Ini adalah sistem yang hebat… memulai kampanye tetes kepada orang-orang yang meminta informasi dan mendorong prospek ke perwakilan penjualan yang sesuai saat diminta. Saya sangat terkesan dengan fleksibilitas bentuk Elementor dan tampilan dan nuansa.
Langkah terakhir adalah menyediakan dasbor analitik untuk klien melalui Google Analytics yang memberi mereka kinerja bulan-ke-bulan pada pengiriman formulir. Mereka telah memasang Google Pengelola Tag, jadi kami telah mencatat transaksi e-niaga dan aktivitas penayangan YouTube di situs.
Saya melakukan beberapa upaya untuk memanfaatkan DOM, pemicu, dan peristiwa dalam Google Pengelola Tag untuk menangkap pengiriman formulir yang berhasil untuk Elementor tetapi tidak berhasil sama sekali. Saya menguji banyak cara berbeda untuk memantau halaman, memperhatikan pesan sukses yang akan muncul melalui AJAX dan itu tidak berfungsi. Jadi… Saya melakukan pencarian dan menemukan solusi hebat dari Tracking Chef, yang disebut Pelacakan formulir Elemen antipeluru dengan GTM.
Skrip menggunakan jQuery dan Google Pengelola Tag untuk mendorong Acara Google Analytics ketika formulir berhasil dikirim. Dengan beberapa suntingan kecil dan satu peningkatan sintaks, saya memiliki semua yang saya butuhkan. Berikut kodenya:
<script>
jQuery(document).ready(function($) {
$(document).on('submit_success', function(evt) {
window.dataLayer = window.dataLayer || [];
window.dataLayer.push({
'event': 'ga_event',
'eventCategory': 'Form ',
'eventAction': evt.target.name,
'eventLabel': 'Submission'
});
});
});
</script>
Ini cukup cerdik, menonton pengiriman yang berhasil, lalu lewat Bentuk sebagai kategori, nama tujuan sebagai Aksi, dan Ketundukan sebagai labelnya. Dengan membuat target terprogram, Anda cukup memiliki kode ini di footer setiap halaman untuk mengamati pengiriman formulir. Jadi… saat Anda menambahkan atau memodifikasi formulir, Anda tidak perlu khawatir tentang memperbarui skrip atau menambahkannya ke halaman lain.
Instal Script Melalui Kode Kustom Elementor
Jika Anda seorang agensi, saya sangat merekomendasikan peningkatan tak terbatas dan penggunaan Elementor untuk semua klien Anda. Ini adalah platform yang solid dan jumlah integrasi mitra terus meroket. Pasangkan dengan Plugin seperti Formulir Kontak DB dan Anda juga dapat mengumpulkan semua pengiriman formulir Anda.
Elementor Pro memiliki opsi manajemen skrip yang bagus. Berikut cara memasukkan kode Anda:
- Navigasi ke Elementor > Kode Kustom
- Beri nama kode Anda
- Tetapkan lokasi, dalam hal ini akhir label tubuh.
- Tetapkan prioritas jika Anda memiliki lebih dari satu skrip yang ingin Anda sisipkan dan atur urutannya.
- Klik perbarui
- Anda akan diminta untuk mengatur kondisi dan hanya mengaturnya ke default semua halaman.
- Segarkan cache Anda dan skrip Anda aktif!
Pratinjau Integrasi Google Pengelola Tag Anda
Google Pengelola Tag memiliki mekanisme luar biasa untuk menghubungkan ke instance browser dan benar-benar menguji kode Anda untuk mengamati apakah variabel dikirim dengan benar atau tidak. Ini penting karena Google Analytics tidak real-time. Anda dapat menguji dan menguji dan menguji dan benar-benar merasa frustrasi karena data tidak muncul di Google Analytics jika Anda tidak menyadarinya.
Disini saya tidak akan memberikan tutorial bagaimana caranya pratinjau dan debug Google Pengelola Tag... Saya akan berasumsi Anda tahu. Saya dapat mengirimkan formulir saya di halaman pengujian saya yang terhubung dan melihat data didorong ke data GTM sebagaimana mestinya:
Dalam hal ini, kategori dikodekan sebagai Formulir, targetnya adalah formulir Hubungi Kami, dan labelnya adalah Pengajuan.
Di Google Pengelola Tag, Siapkan Variabel Data, Peristiwa, Pemicu, dan Tag
Langkah terakhir dalam hal ini adalah menyiapkan Google Pengelola Tag untuk menangkap variabel tersebut dan mengirimkannya ke Tag Google Analytics yang disiapkan untuk suatu peristiwa. Elad Levy merinci langkah-langkah ini di posnya yang lain - Pelacakan Peristiwa Umum Di Google Pengelola Tag.
Setelah itu disiapkan, Anda akan dapat melihat Acara di Google Analytics!
Pengungkapan: Saya menggunakan tautan afiliasi saya di seluruh artikel ini.