Add Google Analytics Event Tracking - Code Parrots

Knowledge Base

Add Google Analytics Event Tracking

Article Last Updated: March 4, 2021

Note: this functionality is only available for AJAX submissions. For more information about AJAX submissions, see the submission settings.

To add Google Analytics event tracking you’ll need to use the yikes-mailchimp-google-analytics action to create your own custom function. Let’s call this function yikes_mailchimp_google_analytics. We supply the current form’s ID to this function, so if you need to use different events or want different functionality based on the form this is easily achievable.

Within our yikes_mailchimp_google_analytics function, we’ll need to create two JavaScript functions:

  1. yikes_mailchimp_google_analytics_failure – this function is fired off when an unsuccessful subscription occurs
  2. yikes_mailchimp_google_analytics_success – this function is fired off when a successful subscription occurs

Note: these two functions will not work if they have a different name

Within each function, add your Google Analytics tracking code. You can see an example of how this works:

add_action( 'yikes-mailchimp-google-analytics', 'yikes_mailchimp_google_analytics', 10, 1 );

function yikes_mailchimp_google_analytics( $form_id ) {
    ?>
        <script type="text/javascript">

            var form_id = <?php echo $form_id; ?>;

            // Fire off GA event for a failed subscription
            function yikes_mailchimp_google_analytics_failure( response ) {

                (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
                (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
                m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
                })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');

                ga( 'create', 'UA-xxxxx-1', 'auto' );
                ga( 'send', 'event', 'mailchimp-subscribe', 'subscription-failed' );
            }

            // Fire off GA event for a successful subscription
            function yikes_mailchimp_google_analytics_success( response ) {

                (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
                (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
                m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
                })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');

                ga( 'create', 'UA-xxxxx-1', 'auto' );
                ga( 'send', 'event', 'mailchimp-subscribe', 'subscription-successful' );
            }

        </script>
    <?php
}

In this example we’re simply sending a Google Analytics event with the category “mailchimp-subscribe” and the action “subscription-failed” for a failed subscription and “subscription-successful” for a successful one.

For more information about the Google Analytics Events API, check out their documentation.