Streaming live at 10am (PST)

Event tracking with the new gtag.js

Hey guys

Seems like the event tracking stopped working after google introduced the new gtag.js any idea how I can continue tracking events?

Thanks

I don’t know about gtag.js (which is specially purposed for webshops), but the new version for ‘normal use’ is ga.js (there is a switch in the settings/integrations page of Webflow). You can implement it almost as in the ‘old’ way as described in: Google Analytics event tracking for buttons in Webflow

but you need to change the code in the footer to:

<!-- Start of Google Analytics Event tracking code -->
<script>
  $(document).ready(function() {
    $(document).on('click', '[data-gatrack]', function(e) {
      var $link = $(this);
      var trackData = $link.data('gatrack');
      if (!trackData) { return; }
    
      var trackParams = ['send', 'event'].concat(trackData.split(','));
      ga.apply(null, trackParams);
    });
  });
</script>
<!-- End of Google Analytics Event tracking code -->

need more data on this

i’ve tried following those instructions exactly, and used the code from this post

no events being triggered in google analytics

any help?

I’ve been attempting to fix the same problem: trying to record events in google analytics from webflow.

I’ve managed to find a solution by doing the following:

  • Don’t use webflow’s google analytics integration under their ‘Integrations’ tab. Instead, paste google’s Global Site Tag (gtag.js) into your site’s <head> tag (under webflow’s ‘Custom Code’ tab).

  • Paste the following code into the ‘Footer Code’ section of webflow’s ‘Custom Code’ tab:

      <script>
       $(document).ready(function() {      
         $(document).on('click', '[data-gatrack]', function(e) {
    
           var $link = $(this);
                   var commaSeperatedEventData = $link.data('gatrack');
                   var eventParams = commaSeperatedEventData.split(',');
    
                   if (!eventParams) { return; }
    
                   eventCategory = eventParams[0]
                   eventAction = eventParams[1]
                   eventLabel = eventParams[2]
    
                   gtag(
                       'event',
                       eventAction,
                       {
                           'event_category': eventCategory,
                           'event_label': eventLabel
                       }
                   )
             
         });
       });
       </script>
    
  • Go to an element you want to track an event on (like a form button), and add a ‘Custom Attribute’ with the following format: Name = data-gatrack Value = yourEventCategory, yourEventAction, yourEventLabel

1 Like

@alexvale, thanks alot for sharing this !