Category / Section
How to Add Google Analytics Code to an Event Registration
Published:
3 mins read
Updated:
Google Analytics is a tool that lets you track and analyze visitor traffic and behavior on your page. Your registration page can be linked with Google Analytics to gain insights from visitor activity and help you meet your goals.
To add tracking to your landing page:
- On Google Analytics dashboard, go to Admin > Property column > Tracking info.
Copy your tracking code. This code is in the below format:
<!-- Google tag (gtag.js) --> <script async src=“https://www.googletagmanager.com/gtag/js?id=UA-XXXXXXXXX-1”></script> <script> window.dataLayer = window.dataLayer || []; function gtag(){dataLayer.push(arguments);} gtag(‘js’, new Date()); gtag(‘config’, ‘UA-XXXXXXXXX’); </script>
- Now, inside the event setup on Zuddl, go to Registration > Registration page.
- Click the edit registration page and enter the page builder
- Under the SEO & Settings menu, Head HTML.
- Paste the tracking code under Head HTML textbox.
- Now, add the custom JS to the code.
function handleRegistrationSuccess(event) { // write your logic here } window.addEventListener('zuddl.registration.success', handleRegistrationSuccess);
This will enable tracking for your registration page. The complete sample code is shown below:
<!-- Google tag (gtag.js) -->
<script async src="https://www.googletagmanager.com/gtag/js?id=X-XXXXXXX"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'X-XXXXXXXX');
// Function to send registration success event to GA4
function handleRegistrationSuccess(event) {
const registrationData = event.detail || {};
gtag('event', 'registration_success', {
event_category: 'Registration',
event_label: registrationData.attendeeDetails[0].email || 'unknown',
value: 1 // You can modify based on your needs
});
console.log("Sent registration success event to GA4:", registrationData);
}
// Listen for Zuddl registration success event
window.addEventListener('zuddl.registration.success', handleRegistrationSuccess);
</script>
Field shown in ‘event.detail’
{
"attendeeDetails": [
{
"name": "John",
"email": "john.acme@zuddl.com"
},
{
"name": "Virat",
"email": "virat@acme.com"
}
]
}
Learn more about how to use the Google Analytics tracking.