Webflow sync, pageviews & more.
NEW

How do I add Google Ads Conversion Tracking code to the submit buttons on the API page and Contact Page Submission buttons in Webflow?

TL;DR
  • Add the Google Ads global site tag in Webflow's Head Code section via Project Settings.
  • Add the conversion event snippet using JavaScript in the Footer Code of your API and Contact pages, targeting specific forms if needed.
  • Replace placeholder values with your actual conversion ID and label, publish, and test using tag debugging tools.

To track conversions via Google Ads when users submit forms on your API and Contact pages in Webflow, you’ll need to add the Google Ads Conversion Tracking code using Webflow’s form submission event.

1. Get Your Google Ads Conversion Code

  • In your Google Ads account, go to Tools & Settings > Conversions.
  • Create a new conversion action for website submissions (the category can be "Lead").
  • When asked how to install the tag, choose Install the tag yourself.
  • Copy both:
  • The Global Site Tag (gtag.js) code (if not already installed).
  • The Event Snippet (specific for the conversion – this will be used on form submit).

2. Add the Global Site Tag (if not already on the site)

  • Go to Project Settings in Webflow.
  • Navigate to the Custom Code tab.
  • Paste the global site tag into the Head Code section.
  • Save and Publish the site for the code to take effect.

3. Add the Event Snippet to Specific Forms

  • You’ll target your API and Contact page forms using JavaScript and Webflow’s native Webflow.push().

  • Add the following to your Page Settings > Footer Code section for both the API and Contact pages:
    ```javascript

    ```

  • Important:

  • Replace AW-CONVERSION_ID/LABEL with the values provided by Google Ads for your conversion.

  • If you want to target only specific forms (e.g., by #id or .class), modify $('.w-form') accordingly (e.g., $('#api-form'), $('.contact-form')).

  • You may also use Webflow’s built-in Form ID or class names to be more specific.

4. Test the Conversion Tracking

  • After publishing, submit a test form.
  • Use the Google Tag Assistant or Google Ads Conversion Tag Debugger Chrome extension to verify that the event fires.
  • You can also view real-time data in Google Ads > Tools > Conversions > Tag Status.

Summary

To track form submissions as Google Ads conversions, add the global site tag to your site, then include the event snippet via custom JavaScript on your API and Contact pages' footers. Ensure you've set up the correct conversion ID and label, and optionally target specific forms for granular tracking.

Rate this answer

Other Webflow Questions