How to set up and track multi-step forms with Google Tag Manager

Homeadmin3

How to set up and track multi-step forms with Google Tag Manager

admin3

Google Tag Manager (GTM) is a powerful tool for managing and tracking website tags, which are snippets of code that track user interactions, events, and conversions. One common use case for GTM is setting up and tracking multi-step forms. In this article, we’ll explore how to set up and track multi-step forms with Google Tag Manager.

What are multi-step forms?

A multi-step form is a form that requires users to complete multiple steps before submitting the form. Each step typically has its own set of fields, and the user must complete all steps before submitting the form. Multi-step forms can be used to collect more information from users, increase conversion rates, or gather more specific data.

Benefits of tracking multi-step forms with Google Tag Manager

Tracking multi-step forms with Google Tag Manager provides several benefits:

  1. Improved conversion tracking: By tracking each step of the form, you can identify which steps are causing friction and optimize the form to improve conversions.
  2. Enhanced analytics: With GTM, you can track user behavior at each step of the form, including which fields are being completed and which are being abandoned.
  3. Personalization: By tracking form progress, you can personalize the user experience by providing targeted messages or offers based on their progress.
  4. Reduced bounce rates: By identifying and addressing issues at each step of the form, you can reduce bounce rates and improve overall user engagement.

1. Set up the form

Before setting up the form in GTM, make sure you have the following:

  1.  A multi-step form on your website
  2. A Google Analytics account (required for tracking)
  3. A Google Tag Manager account (required for setting up tags)

 2. Create a new tag in Google Tag Manager

  1. Log in to your Google Tag Manager account
  2. Click on “Tags” in the left-hand menu
  3. Click on “New”
  4. Select “Custom HTML” as the tag type
  5. Name the tag (e.g., “Multi-Step Form”)
  6. Set the trigger to “Some Event” (we’ll set this up later)

 3. Set up triggers for each step

To track each step of the form, you’ll need to create separate triggers for each step. Here’s an example of how to set up a trigger for Step 1:

  1. Click on “Triggers” in the left-hand menu
  2. Click on “New”
  3. Select “Form Submission” as the trigger type
  4. Set the trigger name (e.g., “Step 1 – Form Submission”)
  5. Set the form ID or class to target the specific form element
  6. Set the trigger firing rule to “Once Per Event” (so that it only fires once per form submission)
  7.  Save the trigger

Repeat this process for each step of the form, creating a separate trigger for each step.

 4. Set up variables for each step

To track user progress through the form, you’ll need to set up variables for each step. Here’s an example of how to set up a variable for Step 1:

  1. Click on “Variables” in the left-hand menu
  2. Click on “New”
  3.  Select “Custom JavaScript Variable” as the variable type
  4.  Name the variable (e.g., “Step 1 Completed”)
  5.  Set the variable value to `{{form_fields}}` (this will capture all fields completed at Step 1)
  6. Save the variable

Repeat this process for each step of the form, creating a separate variable for each step.

 5. Set up tags for each step

Now that you have triggers and variables set up for each step, you can create tags to track user progress through the form. Here’s an example of how to set up a tag for Step 1:

  1.  Go back to your custom HTML tag created in Step 2
  2. In the tag settings, add a new condition: `{{ Step 1 Completed }} == true`
  3. Add a new action: `ga(‘send’, ‘event’, ‘Multi-Step Form’, ‘Step 1 Completed’)`
  4. Repeat this process for each step of the form, creating a separate tag for each step.

 6. Fire triggers on page load

To ensure that your tags fire correctly, you’ll need to fire triggers on page load:

  1.  Go back to your custom HTML tag created in Step 2
  2.  Add a new trigger: `Page Load`
  3. Make sure the trigger is enabled

 7. Test your setup

Test your setup by filling out the form and verifying that your tags are firing correctly:

  1. Fill out Step 1 of the form
  2. Verify that your Step 1 Completed variable is populated correctly
  3. Fill out Step 2 of the form
  4. Verify that your Step 2 Completed variable is populated correctly
  5. Continue testing each step until you reach the final submission

Setting up and tracking multi-step forms with Google Tag Manager requires careful planning and configuration, but it provides valuable insights into user behavior and conversion rates. By following these steps, you can track user progress through your multi-step form and optimize it for better results.

Additional Tips and Considerations

  1. Make sure to test your setup thoroughly to ensure that tags are firing correctly
  2. Consider using GTM’s built-in debugging tools to troubleshoot any issues
  3. Use segmentation in Google Analytics to analyze user behavior by step completion
  4.  Consider using GTM’s built-in funnel analysis tool to analyze conversion rates by step completion