If your Webflow event tracking stopped working after Google introduced gtag.js, here’s how to update your setup for continued functionality.
1. Update to gtag.js
- Remove any existing
analytics.js code from your Webflow project if present. - Add the gtag.js snippet: Go to your Project Settings, select the Custom Code tab, and paste the
gtag.js snippet provided by Google into the Head Code section. - Ensure you publish your project after making these changes for them to take effect.
2. Configure Event Tracking
- With gtag.js, events are tracked using the
gtag('event',...) method. - Go to your Webflow project and add new event tracking code as needed. For each event you want to track, such as a button click, use this format:
- Example:
gtag('event', 'click', {'eventcategory': 'button', 'eventlabel': 'purchase_button'});
3. Test Your Tracking
- After updating the event tracking code, test the functionality on your live site to ensure it’s working correctly.
- Use Google Tag Assistant or Google Analytics Real-Time reports to confirm that events are being captured as expected.
4. Adjust Google Analytics Settings
- In your Google Analytics account, verify that your property settings match the gtag.js setup.
- Ensure that all required custom dimensions or metrics are correctly set up if you track any specific data.
5. Publish and Verify
- Once updates are done, publish each relevant Webflow page to ensure all changes are live.
- Double-check for event firing and data capturing in your Google Analytics console.
Summary
Transitioning to gtag.js in Webflow involves updating your custom code to replace analytics.js, configuring your event tracking via the gtag('event',...) method, and thoroughly testing the setup with Google's tools. Make sure that your project is correctly published to apply these changes effectively.