How do I track form submissions in GA4?

Applies to: Google Analytics 4 (GA4)
Last updated: May 2025


Problem

You want to track when users submit forms on your website—such as contact forms, newsletter signups, or quote requests—using GA4 for analysis and conversion tracking.


Solution

GA4 doesn’t automatically track form submissions, so you need to create a custom event. You can do this using Google Tag Manager (GTM), or manually with JavaScript if GTM isn’t available. Once the event is created, you can mark it as a conversion in GA4.


Step-by-Step Guide Using Google Tag Manager

1. Open Google Tag Manager


2. Enable Built-in Variables

  • Go to Variables > Configure
  • Enable Form ID, Form Classes, and Form Element

3. Create a Form Submission Trigger

  1. Go to Triggers > New
  2. Name the trigger (e.g., “Form Submit – All Forms”)
  3. Choose Form Submission as the trigger type
  4. Check the box: Wait for Tags and Check Validation
  5. Optional: Restrict to specific forms using conditions like:
    • Form ID equals contact-form
    • Page URL contains /contact
  6. Save the trigger

4. Create a GA4 Event Tag

  1. Go to Tags > New
  2. Choose Google Analytics: GA4 Event
  3. Set your GA4 Configuration tag
  4. Set the event name (e.g., form_submit)
  5. (Optional) Add parameters like:
    • form_id: {{Form ID}}
    • page_path: {{Page Path}}
  6. Attach the Form Submission trigger
  7. Save and publish the tag

5. Test in Preview Mode

  1. Use GTM’s Preview mode to visit your site
  2. Submit the form
  3. Verify the event fires
  4. In GA4, go to Admin > DebugView to confirm the event is received

Optional: Mark the Event as a Conversion in GA4

  1. In GA4, go to Admin > Conversions
  2. Click New Conversion Event
  3. Enter the event name exactly (e.g., form_submit)
  4. Click Save

This will count each form submission as a conversion.


Alternative Method (No GTM)

If you’re not using GTM, you can fire the GA4 event using JavaScript directly in your site:

<script>
gtag('event', 'form_submit', {
form_id: 'contact-form'
});
</script>

Place this in your form’s onsubmit handler or success callback after validation.


Notes

  • For multi-step or AJAX forms, you may need to listen for custom JavaScript events or success messages
  • Avoid duplicate tracking by ensuring the event fires only once per submission
  • Use different event names or parameters if you want to distinguish multiple forms

You may also like...