How can I properly track form submissions on my Webflow site that come from Google Adwords? I have followed the steps provided by Google, but I am unsure about where to add the code and how to link it to the submit button. I have already attempted to add the code in the custom code section labeled "Inside tag". Can someone please help me with this?

TL;DR

Add the Google Ads Global Site Tag to Webflow's <head> section via Project Settings.
Use a unique Form ID and insert custom JavaScript in the Footer to detect successful submissions via MutationObserver and trigger the Ads conversion event.
Replace placeholder conversion ID/label with actual values from Google Ads and publish the site.

To track form submissions on your Webflow site from Google Ads, you need to ensure the Google Ads conversion tracking code fires only after a successful form submission. Adding the code merely “Inside <head> tag” is not sufficient.

1. Understand What Google Ads Requires

Conversion tracking requires a JavaScript event snippet that fires when a conversion (form submission) occurs.
This snippet is provided during setup in your Google Ads account, typically under Tools > Conversions.

2. Place the Global Site Tag Correctly

Go to Webflow Dashboard > Project Settings > Custom Code.
Paste the Global Site Tag (gtag.js) provided by Google Ads into the "Inside <head> tag" section.

3. Add the Event Snippet After Form Submission

Since Webflow AJAX-handles form submissions, you need to target the form's submit success event using Webflow interactions or custom JavaScript.

Use this process:

Go to the Webflow Designer.
Select the Form.
In the right panel, go to the Form Settings and set a unique Form ID (e.g., adwords-form).
Then go to Page Settings > Custom Code > Footer Section and add this JavaScript:

<script>
  document.addEventListener("DOMContentLoaded", function () {
    var form = document.getElementById("adwords-form");
    if (form) {
      form.addEventListener("submit", function (e) {
        var observer = new MutationObserver(function (mutations) {
          mutations.forEach(function (mutation) {
            if (mutation.target.classList.contains("w-form-done")) {
              gtag('event', 'conversion', {
                'send_to': 'AW-XXXXXXXXX/YYYYYYYYYY' // Replace with your actual conversion ID and label
              });
              observer.disconnect();
            }
          });
        });

        observer.observe(form.parentNode, {
          attributes: true,
          attributeFilter: ['class'],
          subtree: true
        });
      });
    }
  });
</script>

4. Replace the Conversion ID and Label

Replace 'AW-XXXXXXXXX/YYYYYYYYYY' with your Google Ads Conversion ID and Conversion Label, which are shown in your Google Ads dashboard when you create a conversion action.

5. Publish Your Webflow Site

Go to Webflow Dashboard > Publish and publish the site to the correct domain.
Test the form to confirm the event fires using browser console or Google Tag Assistant.

Summary

To track Google Ads conversions on your Webflow form, put the Global Site Tag in the <head> section, and the event snippet in custom code that triggers when the Webflow form successfully submits. Use a combination of form ID and MutationObserver to detect the success state and trigger the gtag conversion event.

Webflow Resources

Webflow templates

Webflow inspiration

Rate this answer