If you’re building or managing a Webflow site and you’re serious about marketing, it’s time to get serious about tracking.
Adding pixels from platforms like Twitter (X), Meta (Facebook/Instagram), and Google Ads allows you to measure user behavior, retarget visitors, and optimize ad performance with real-world data.
But how do you do it in Webflow?
In this post, I’ll show you how to:
- Install multiple tracking pixels on your site
- Set up custom events for buttons, form submissions, or product views
- Avoid common tracking mistakes in Webflow
Why event tracking is important?
Event tracking allows you to:
- Create custom audiences for retargeting
- Track ad performance across multiple platforms
- Trigger conversion events when users take specific actions (like submitting a form or clicking a call to action)
- More accurately measure your ROI and campaign success
- Without event tracking, you’re essentially flying blind.
1. Add your pixels to Webflow
Google Ads pixel (global site tag)
Go to your Webflow project settings → Custom Code.
Paste the Google Ads global site tag inside the <head> section.
<!-- Global site tag (gtag.js) -->
<script async src="https://www.googletagmanager.com/gtag/js?id=AW-XXXXXXX"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'AW-XXXXXXX');
</script>
2.Meta Pixel (Facebook/Instagram)
In the Meta Event Manager, create a new pixel.
Copy the base code and paste it into the <head> of your Webflow custom code:
<!-- Meta Pixel Code -->
<script>
!function(f,b,e,v,n,t,s) {
if(f.fbq)return;n=f.fbq=function(){n.callMethod ?
n.callMethod.apply(n,arguments):n.queue.push(arguments)};
if (!f._fbq) f._fbq=n;n.push=n;n.loaded=!0;n.version='2.0';
n.queue=[];t=b.createElement(e);t.async=!0;
t.src=v;s=b.getElementsByTagName(e)[0];
s.parentNode.insertBefore(t,s)
}(window, document,'script',
'https://connect.facebook.net/en_US/fbevents.js');
fbq('init', 'YOUR_PIXEL_ID');
fbq('track', 'PageView');
</script>
<noscript>
<img height="1" width="1" style="display:none"
src="https://www.facebook.com/tr?id=YOUR_PIXEL_ID&ev=PageView&noscript=1"/>
</noscript>
3.Twitter (X) Pixel
Sign in to Twitter Ads → Tools → Pixel → Create New.
Select Universal Website Tag.
Add this code inside the <head>:
<!-- Twitter Universal Website Tag Code -->
<script>
!function(e,t,n,s,u,a) {e.twq||(s=e.twq=function(){s.exe?s.exe.apply(s,arguments):s.queue.push(arguments);
},s.version='1.1',s.queue=[],u=t.createElement(n),
u.async=!0,u.src='//static.ads-twitter.com/uwt.js',
a=t.getElementsByTagName(n)[0],a.parentNode.insertBefore(u,a))
}(window,document,'script');
twq('init','o0o0o'); // Replace with your pixel ID
twq('track','PageView');
</script>
Track custom events (clicks, forms, etc.)
You can track specific actions such as form submissions, button clicks, or visits to your Thank You page.
1.Form Submission (Meta and Google)
Redirect your form to a custom thank you page and track that URL using:
Meta:
javascript
Copy
Edit
fbq('track', 'Lead')
Google:
javascript
Copy
Edit
gtag('event', 'conversion', {'send_to': 'AW-CONVERSION_ID/label'});
Add this inside your Webflow thank you page settings under "Before </body>".
2.Track button clicks
Let's say you want to track a click on a call to action (e.g. "Book Now").
Add an HTML embed within Webflow:
<a href="/booking" onclick="fbq('track', 'Contact'); gtag('event', 'contact_click'); twq('track','CompleteRegistration');">
Book Now
</a>
Or implement the script via custom code and Webflow interactions:
Add a class to your button (e.g. .track-cta)
<script>
document.querySelector('.track-cta')?.addEventListener('click', function() {
fbq('track', 'Contact');
gtag('event', 'contact_click');
twq('track', 'CompleteRegistration');
});
</script>
Common Mistakes to Avoid
- Forgetting to Replace Pixel IDs with Your Own
- Not Checking That the Event Actually Fired (Use Meta Pixel Helper, Google Tag Assistant, Twitter Pixel Helper)
- Relying Solely on Thank You Pages (Form Redirects May Fail)
- Not Setting Up Dedicated Conversion Events on Each Ad Platform
Adding and Managing Multiple Pixels in Webflow Doesn’t Have to Be Intimidating. With the Right Setup, You Can Track Key User Actions on Twitter/X, Meta, and Google, and Use That Data to Build Smarter, More Profitable Campaigns.
.svg)
