Track Contact Form 7 form submissions in Google Tag Manager without a Thank You page

If you have ever tried to set up an element visibility trigger in tag manager for a successful form completion event you may have been frustrated by the fact that the error and the success message in Contact Form 7 have the same ID and css class. Since Contact Form 7 uses ajax form submission this makes it much harder to track in tag manager.

There is one simple way to add a different class to the Contact Form 7 success message only.

1. Login to WordPress
2. Go to Appearance -> Theme Editor
3. Click on functions.php in the side menu of your current theme (should be the child theme of your main theme)
4. Add the following code at the bottom of funtions.php
   
   Copy Code Copied Use a different Browser

   
   add_action('wp_head', 'track_forms');
   function track_forms(){
   ?>
   
   <?php
   };
   

5. Click on the save changes button.
6. Now when you make a successful form submission, you will see this class added to the container for the success message:

This method checks for successful completion of a the mail sent event in Contact Form 7 and then adds the class. I used this method on a form that uses skip mail and it still successfully added the class.