Is there an integrated or easy way to set up Google Analytics in Webflow to only track analytics on the production site at a custom domain and fire an event only when a user completes a successful form submission?
TL;DR
- Add Google Analytics tracking ID in Webflow Project Settings under Integrations.
- In the Hosting tab, use conditional JavaScript to limit tracking to the production domain.
- Under Custom Code, add a script to track form submissions via event tracking.
- Publish your Webflow site and test the setup on the production domain.
To set up Google Analytics in Webflow to track only your production site and trigger an event on successful form submissions, follow these steps:
1. Add Google Analytics to Your Webflow Site
- Go to Project Settings in your Webflow dashboard.
- Navigate to the Integrations tab.
- Locate the Google Analytics section and enter your Google Analytics tracking ID (e.g., UA-XXXXXXXXX-X for Universal Analytics or G-XXXXXXXXXX for GA4).
2. Limit Tracking to Production Site
- Go to the Hosting tab in Project Settings.
- Scroll down to Custom Code and Open Head Code.
- Insert conditional JavaScript to check if the site is on the production domain:
if (window.location.hostname === 'www.yourdomain.com') { / Your Google Analytics script here / }.
3. Set Up Event Tracking for Form Submissions
- In the Custom Code section under Before Body Tag, add a script to track form submissions:
- For Universal Analytics:
```javascript
<script>
document.addEventListener('submit', function(e) {
if (e.target.matches('form')) {
gtag('event', 'form_submit', {
'event_category': 'Form',
'event_label': e.target.getAttribute('name')
});
}
});
</script>
```
- Ensure this script is within the conditional statement if only required for production.
4. Publish Your Site
- Publish your Webflow site to the custom domain.
- Ensure all scripts and conditional checks are functioning by visiting the domain and testing a form submission.
Summary
To set up Google Analytics on your Webflow site for tracking on a production domain and capturing form submission events, you need to add your tracking ID to the project, ensure tracking runs only on the production domain, and append a form submission tracking script with conditional logic.