Webflow sync, pageviews & more.
NEW

How can I create a GA4 Event to track form conversions using Webflow, Google Tag Manager, and Google Analytics 4?

TL;DR
  • Add GTM to your Webflow site's custom code section and publish.
  • In GTM, create a Form Submission trigger and link it to a GA4 Event tag with custom parameters.
  • Test in GTM Preview and GA4 DebugView, then mark the event as a conversion in GA4.

To track form conversions in Webflow using GA4, you’ll need to use Google Tag Manager (GTM) to detect Webflow’s native form submission and send a GA4 event via GTM.

1. Set Up Google Tag Manager in Webflow

  • Go to Project Settings > Custom Code in Webflow.
  • In the Head section, paste your GTM container code (upper part).
  • In the Body section, paste the GTM container code (lower part).
  • Publish your Webflow site to apply the changes.

2. Enable Form Submission Trigger in GTM

  • In GTM, click Triggers > New.
  • Choose Form Submission as the trigger type.
  • Enable "Check Validation" to avoid catching incomplete form submissions.
  • Optional: For cleaner targeting, use Trigger Conditions like Page Path contains /contact or form-specific classes (if applicable).
  • Name and save the trigger (e.g., “Webflow Form Submit”).

3. Configure GA4 Event Tag in GTM

  • Go to Tags > New.
  • Tag Type: Choose Google Analytics: GA4 Event.
  • Choose or create your GA4 Configuration Tag (with your GA4 Measurement ID).
  • Under Event Name, use something like form_submit (use snake_case, lowercase).
  • Under Event Parameters, you can add:
  • parameter name: form_location, value: {{Page Path}}
  • parameter name: form_id, value: {{Form ID}} (if available)
  • In the Triggering section, select the form submission trigger created earlier.
  • Save and publish the GTM workspace.

4. (Optional) Test Using GTM Preview and GA4 DebugView

  • In GTM, click Preview and enter your website URL to open the GTM debug pane.
  • Submit a form; ensure your form submission trigger fires.
  • Go to GA4 > Admin > DebugView to verify the event is received by GA4.

5. Mark the Event as a Conversion in GA4

  • In GA4 > Events, find your form_submit event after some data has come in.
  • In the event list, click the toggle to mark it as a conversion.

Summary

To track form conversions in Webflow using GA4, install GTM in your Webflow project, create a form submission trigger, and send a GA4 event when a form is submitted. Then, mark this event as a conversion in GA4 to track it in reports.

Rate this answer

Other Webflow Questions