• Resolved david44pixel

    (@david44pixel)


    Hi.

    I am using MailChimp for WP to create a form on my website:

    https://44reports.com/

    It works great and I am able to collect signups.

    My problem is that I would like to track form successes and/or signups.
    I am able to track form errors and starts following the documentation from these articles:
    https://kb.mc4wp.com/javascript-form-events/
    https://kb.mc4wp.com/form-events-google-analytics-tracking/

    However no event seems to fire on a success.

    This is my form code:

    <h2>
      Bliv alfa-tester
    </h2> 	
    	<div class="input-icon-wrapper">
          <div class="input-icon">
            <i class="fa fa-user" aria-hidden="true"></i>
          </div>
          <input type="text" name="NAME" placeholder="navn" required>
          <!--<span class="help-tip">Vi vil gerne l?re dig at kende.</span>-->
    	</div>
    
    	<div class="input-icon-wrapper">
          <div class="input-icon">
            <i class="fa fa-envelope" aria-hidden="true"></i>
          </div>
          <input type="email" name="EMAIL" placeholder="e-mail" required />
          <!--<span class="help-tip">Vi vil gerne l?re dig at kende.</span>-->
    	</div>
    
    	<div class="input-icon-wrapper">
          <div class="input-icon">
            <i class="fa fa-building" aria-hidden="true"></i>
          </div>
          <input type="text" name="WEBSITE" placeholder="website" required>
          <!--<span class="help-tip">Vi vil gerne l?re dig at kende.</span>-->
    	</div>
    
    	<div class="input-submit-wrapper">
          <div class="input-submit-icon">
            <i class="fa fa-arrow-right" aria-hidden="true"></i>
          </div>
          <input class="main-cta button-cta" type="submit" value="Bliv alfa-tester nu" />
    	</div>
    
    <script type="text/javascript">
    mc4wp.forms.on('success', function(form) {
    	dataLayer.push({'event': 'form-success',
                       'eventLabel': 'frontpage-hero-form'
                       });
    });
    mc4wp.forms.on('started', function(form) {
      	dataLayer.push({'event': 'form-started',
                       'eventLabel': 'frontpage-hero-form'
                       });
    });
    mc4wp.forms.on('error', function(form) {
    	dataLayer.push({'event': 'form-submit-error',
                       'eventLabel': 'frontpage-hero-form'
                       });
    });
    </script>
    <script type="text/javascript">
    mc4wp.forms.on('subscribed', function(form) {
    	// analytics.js
    	ga && ga('send', 'event', 'Forms', 'Sign-up', 'Name: ' + form.name + 'ID: ' + form.id);
    });
    </script>

    Thank you in advance

    The page I need help with: [log in to see the link]

Viewing 3 replies - 1 through 3 (of 3 total)
  • Plugin Author Danny van Kooten

    (@dvankooten)

    Hi David,

    This seems to be because you have the JS script inside your form but are then hiding (not printing) these form fields when the form is successfully submitted. This means that the JavaScript success event listener is not added for the request after which is should actually fire.

    We’re going to look into providing a fix/workaround for this but until then, I recommend adding your JavaScript somewhere near the footer of your website, eg via a plugin like Header & Footer Scripts.

    Cheers!

    Thread Starter david44pixel

    (@david44pixel)

    Thank you for the quick reply! ??

    I will try your workaround and see how it goes.

    Thread Starter david44pixel

    (@david44pixel)

    Hello. Just wanted to let you know that moving the script to the footer worked.

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Unable to track form Signup and Success’ is closed to new replies.