Announcement

Collapse
No announcement yet.

Logging error messages with Google Analytics

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

    Logging error messages with Google Analytics

    You can push any error messages to Google Analytics with event tracking.


    Code:
    <mvt:if expr="l.settings:messages:error_message_count">
        <div class="global-message-container">
            <mvt:foreach iterator="error" array="messages:error_messages">
            <div class="global-error-message">&mvt:error;</div>
            <script type="text/javascript">
            dataLayer.push({'event': 'GAevent', 'eventCategory' : 'error_&mvte:global:screen;', 'eventAction' : 'error', 'eventLabel' : '&mvt:error;'});
            </script>
            </mvt:foreach>
        </div>
    </mvt:if>
    <mvt:if expr="l.settings:messages:information_message_count">
        <div class="global-message-container">
            <mvt:foreach iterator="message" array="messages:information_messages">
            <div class="global-info-message">&mvt:message;</div>
            </mvt:foreach>
        </div>
    </mvt:if>

    I use Google Tagmanager so my code is different than whatever flavor of Analytics you may use but you get the idea.


    I also noticed that g.screen variable does not necessarily display the screen template, it displays the value that g.screen was set to in the forms hidden input. So for example, errors on the OPAY page will be in the eventCategory of 'INVC'.

    If that bothers you then you can create a hidden input for g.PrevScreen and use that for the eventCategory instead.
    http://www.alphabetsigns.com/

    #2
    Re: Logging error messages with Google Analytics

    This is really funny because I just did this to our site yesterday (been on my todo list for a while now). That unreliable g.Screen variable bugs me, so I just hardcoded the global screen field myself. For those of us using the standard ga.js code, here's what you can use:

    Code:
    <script type="text/javascript">
    if (_gaq) {
    try {
    	<mvt:item name="toolkit" param="vassign|payment_message|g.Error_messages[1]" />
    	<mvt:item name="toolkit" param="sglosub|g.error_messages,'," />
    	_gaq.push(['_trackEvent', 'Error', 'OCST', '&mvte:global:error_messages;', true]);
    } catch(err) {};
    }
    </script>
    The if and try conditionals are optional (and probably unneeded), but I always do that with my GA integrations.

    Comment


      #3
      Re: Logging error messages with Google Analytics

      Hey Brandon,
      I always enjoy your posts so it's very ironic that we both adding it to our sites during the same day. I saw it on one of those G+ threads I follow and had been meaning to implement it myself for some time.

      A couple points I want to share with other Merchants:

      1. This is a best practice every Merchant should implement.

      2. You will be surprised by the data.

      3. You can provide a value that each error costs you.

      4. This is actionable data

      5. You can create your own error messages and conditionals to dig further down to the problems.

      6. Collect enough data before you start making major changes.

      I'll share some errors that I first saw.

      OCST - 'One or more required fields were not filled out correctly' - (I wish I knew which ones)

      OSEL - 'Invalid Payment Method' - (I thought I fixed that problem with javascript)

      OPAY - 'One or more required fields were not filled out correctly' - (I wish I knew which ones, Credit card, agree to term and conditions?)

      So looking at my Checkout Funnel bounce rates I figure the OCST would be the place to start. So I added some custom conditionals to see if there is a particular field that is causing an issue (I'm betting its the email address but it could be a primary field thing.)

      I wish we had more robust error messaging or if there was an easier way but here is some custom GA dataLayer code:

      Code:
      <mvt:if expr="g.ShipFirstName_Invalid">
          <script type="text/javascript">
          dataLayer.push({'event': 'GAevent', 'eventCategory' : 'error_&mvte:global:screen;', 'eventAction' : 'error', 'eventLabel' : 'ShipFirstName_Invalid'});
          </script> 
      </mvt:if>
      <mvt:if expr="g.ShipLastName_Invalid">
          <script type="text/javascript">
          dataLayer.push({'event': 'GAevent', 'eventCategory' : 'error_&mvte:global:screen;', 'eventAction' : 'error', 'eventLabel' : 'ShipLastName_Invalid'});
          </script> 
      </mvt:if>
      <mvt:if expr="g.ShipEmail_Invalid">
          <script type="text/javascript">
          dataLayer.push({'event': 'GAevent', 'eventCategory' : 'error_&mvte:global:screen;', 'eventAction' : 'error', 'eventLabel' : 'ShipEmail_Invalid'});
          </script> 
      </mvt:if>
      <mvt:if expr="g.ShipPhone_Invalid">
          <script type="text/javascript">
          dataLayer.push({'event': 'GAevent', 'eventCategory' : 'error_&mvte:global:screen;', 'eventAction' : 'error', 'eventLabel' : 'ShipPhone_Invalid'});
          </script> 
      </mvt:if>
      <mvt:if expr="g.ShipCompany_Invalid">
          <script type="text/javascript">
          dataLayer.push({'event': 'GAevent', 'eventCategory' : 'error_&mvte:global:screen;', 'eventAction' : 'error', 'eventLabel' : 'ShipCompany_Invalid'});
          </script> 
      </mvt:if>
      <mvt:if expr="g.ShipAddress1_Invalid">
          <script type="text/javascript">
          dataLayer.push({'event': 'GAevent', 'eventCategory' : 'error_&mvte:global:screen;', 'eventAction' : 'error', 'eventLabel' : 'ShipAddress1_Invalid'});
          </script> 
      </mvt:if>
      <mvt:if expr="g.ShipAddress2_Invalid">
          <script type="text/javascript">
          dataLayer.push({'event': 'GAevent', 'eventCategory' : 'error_&mvte:global:screen;', 'eventAction' : 'error', 'eventLabel' : 'ShipAddress2_Invalid'});
          </script> 
      </mvt:if>
      <mvt:if expr="g.ShipCity_Invalid">
          <script type="text/javascript">
          dataLayer.push({'event': 'GAevent', 'eventCategory' : 'error_&mvte:global:screen;', 'eventAction' : 'error', 'eventLabel' : 'ShipCity_Invalid'});
          </script> 
      </mvt:if>
      <mvt:if expr="g.ShipState_Invalid">
          <script type="text/javascript">
          dataLayer.push({'event': 'GAevent', 'eventCategory' : 'error_&mvte:global:screen;', 'eventAction' : 'error', 'eventLabel' : 'ShipState_Invalid'});
          </script> 
      </mvt:if>
      <mvt:if expr="g.ShipZip_Invalid">
          <script type="text/javascript">
          dataLayer.push({'event': 'GAevent', 'eventCategory' : 'error_&mvte:global:screen;', 'eventAction' : 'error', 'eventLabel' : 'ShipZip_Invalid'});
          </script> 
      </mvt:if>
      <mvt:if expr="g.ShipCountry_Invalid">
          <script type="text/javascript">
          dataLayer.push({'event': 'GAevent', 'eventCategory' : 'error_&mvte:global:screen;', 'eventAction' : 'error', 'eventLabel' : 'ShipCountry_Invalid'});
          </script> 
      </mvt:if>
      <mvt:if expr="g.BillFirstName_Invalid">
          <script type="text/javascript">
          dataLayer.push({'event': 'GAevent', 'eventCategory' : 'error_&mvte:global:screen;', 'eventAction' : 'error', 'eventLabel' : 'BillFirstName_Invalid'});
          </script> 
      </mvt:if>
      <mvt:if expr="g.BillLastName_Invalid">
          <script type="text/javascript">
          dataLayer.push({'event': 'GAevent', 'eventCategory' : 'error_&mvte:global:screen;', 'eventAction' : 'error', 'eventLabel' : 'BillLastName_Invalid'});
          </script> 
      </mvt:if>
      <mvt:if expr="g.BillEmail_Invalid">
          <script type="text/javascript">
          dataLayer.push({'event': 'GAevent', 'eventCategory' : 'error_&mvte:global:screen;', 'eventAction' : 'error', 'eventLabel' : 'BillEmail_Invalid'});
          </script> 
      </mvt:if>
      <mvt:if expr="g.BillPhone_Invalid">
          <script type="text/javascript">
          dataLayer.push({'event': 'GAevent', 'eventCategory' : 'error_&mvte:global:screen;', 'eventAction' : 'error', 'eventLabel' : 'BillPhone_Invalid'});
          </script> 
      </mvt:if>
      <mvt:if expr="g.BillCompany_Invalid">
          <script type="text/javascript">
          dataLayer.push({'event': 'GAevent', 'eventCategory' : 'error_&mvte:global:screen;', 'eventAction' : 'error', 'eventLabel' : 'BillCompany_Invalid'});
          </script> 
      </mvt:if>
      <mvt:if expr="g.BillAddress1_Invalid">
          <script type="text/javascript">
          dataLayer.push({'event': 'GAevent', 'eventCategory' : 'error_&mvte:global:screen;', 'eventAction' : 'error', 'eventLabel' : 'BillAddress1_Invalid'});
          </script> 
      </mvt:if>
      <mvt:if expr="g.BillAddress2_Invalid">
          <script type="text/javascript">
          dataLayer.push({'event': 'GAevent', 'eventCategory' : 'error_&mvte:global:screen;', 'eventAction' : 'error', 'eventLabel' : 'BillAddress2_Invalid'});
          </script> 
      </mvt:if>
      <mvt:if expr="g.BillState_Invalid">
          <script type="text/javascript">
          dataLayer.push({'event': 'GAevent', 'eventCategory' : 'error_&mvte:global:screen;', 'eventAction' : 'error', 'eventLabel' : 'BillState_Invalid'});
          </script> 
      </mvt:if>
      <mvt:if expr="g.BillZip_Invalid">
          <script type="text/javascript">
          dataLayer.push({'event': 'GAevent', 'eventCategory' : 'error_&mvte:global:screen;', 'eventAction' : 'error', 'eventLabel' : 'BillZip_Invalid'});
          </script> 
      </mvt:if>
      <mvt:if expr="g.BillCountry_Invalid">
          <script type="text/javascript">
          dataLayer.push({'event': 'GAevent', 'eventCategory' : 'error_&mvte:global:screen;', 'eventAction' : 'error', 'eventLabel' : 'BillCountry_Invalid'});
          </script> 
      </mvt:if>
      http://www.alphabetsigns.com/

      Comment


        #4
        Re: Logging error messages with Google Analytics

        That unreliable g.Screen variable bugs me...
        Try the new l.settings:page:code / &mvte:page:code; instead.

        Comment


          #5
          Re: Logging error messages with Google Analytics

          Thanks Dan, that worked.
          http://www.alphabetsigns.com/

          Comment


            #6
            Re: Logging error messages with Google Analytics

            Originally posted by Dan - Glendale Designs View Post
            Try the new l.settings:page:code / &mvte:page:code; instead.
            When did this amazingness get added? And is there any difference between l.settings:page:code and g.page_code?

            Comment


              #7
              Re: Logging error messages with Google Analytics

              When did this amazingness get added?
              Few versions back. I suspect it is used for the CSSUI underpinnings to ensure the proper CSS is fired for each individual page/body id, as well as a few other features. You also have &mvt:page:name; as well, which used to require a 3rd party module.

              And is there any difference between l.settings:page:code and g.page_code?
              To my knowledge no. They appear to be identical outside of their scope and availability seems constant.

              Maybe someone from MM will chime in for further clarification.

              Comment

              Working...
              X