apps/web/guides/gtm-track-lead.md
Configure Google Tag Manager for lead tracking
The following steps assume that you've already installed the Dub Analytics script through GTM.
To read the dub_id cookie that Dub Analytics sets, you'll need to create a new User-Defined Variable in Google Tag Manager.
In your GTM workspace, navigate to the Variables section and click New to create a new variable.
Configure the variable with the following settings:
dub_idClick Save to create the variable.
There are two ways to track lead events with Google Tag Manager:
This method tracks leads when users land on a thank-you or success page after completing a form. This approach is more reliable as it's less likely to be blocked by ad blockers and provides better data accuracy.
Create a Custom HTML tag with the following code:
<script>
(function () {
// Get query parameters from URL
var params = new URLSearchParams(window.location.search);
var email = params.get("email");
var name = params.get("name");
// Get dub_id from cookie using GTM variable
var clickId = {{Dub ID Cookie}} || "";
// Only track the lead event if email and clickId are present
if (email && clickId) {
dubAnalytics.trackLead({
eventName: "Sign Up",
customerExternalId: email,
customerName: name || email,
customerEmail: email,
clickId: clickId,
});
}
})();
</script>
Important: Make sure to pass along the
namequery parameters to the thank-you page so that the lead event can be attributed to the correct customer.
Configure this tag to fire on specific pages by creating a Page View trigger with conditions:
/thank-you/successName this tag "Dub Lead Tracking - Thank You Page" and save it.
This method tracks leads immediately when users submit forms on your website. Note that this approach may be less reliable due to ad blockers and timing issues.
Create a Custom HTML tag with the following code:
<script>
(function () {
// Get form data - customize these selectors based on your form
var name = document.getElementById("name")
? document.getElementById("name").value
: "";
var email = document.getElementById("email")
? document.getElementById("email").value
: "";
// Get dub_id from cookie using GTM variable
var clickId = {{Dub ID Cookie}} || "";
// Only track the lead event if email and clickId are present
if (email && clickId) {
dubAnalytics.trackLead({
eventName: "Sign Up",
customerExternalId: email,
customerName: name || email,
customerEmail: email,
clickId: clickId,
});
}
})();
</script>
Important: You'll need to customize the DOM selectors (
getElementById('name'),getElementById('email')) to match your actual form field IDs or use different methods to capture the form data based on your website's structure.
Configure this tag to fire on Form Submission by creating a new trigger:
Name this tag "Dub Lead Tracking - Form Submission" and save it.
To test your GTM setup, you can use the Preview mode in Google Tag Manager:
[email protected]&name=Test User)You can also verify that leads are being tracked by: