How can I push the email address to the datalayer on a form submission in Webflow for enabling enhanced tracking in Google Ads?

Published on
September 22, 2023

To push the email address to the datalayer on a form submission in Webflow for enabling enhanced tracking in Google Ads, follow these steps:

  1. Open your Webflow project and navigate to the page that contains the form you want to track.
  2. Select the form element and click on the Settings tab in the right sidebar.
  3. Under the Actions section, click on the Success event dropdown and select "Custom code."
  4. In the Custom code box, you will need to write JavaScript code to push the email address to the datalayer. Here's an example of how you can do this:
<script>  document.addEventListener('wpcf7mailsent', function(event) {    var email = event.detail.inputs.find(function(input) {      return input.name === 'email';    }).value;    dataLayer.push({      'event': 'formSubmission',      'email': email    });  });</script>

In this example, we're using the Contact Form 7 plugin which triggers a wpcf7mailsent event on successful form submission. Adjust the event name depending on the form plugin you're using.

  1. Replace 'email' with the name or ID of the email field in your form.

  2. Save your changes and publish the updated website.

With these steps, the email address from your form submissions will be pushed to the datalayer whenever a form is successfully submitted. This enables enhanced tracking in Google Ads, allowing you to utilize the email data for remarketing or tracking conversions.

Additional Resources

Additional Questions:

  1. How do I integrate Google Analytics with Webflow?
  2. How can I track button clicks in Webflow using Google Tag Manager?
  3. Is it possible to set up A/B testing in Webflow to optimize conversions?