Capturing events from Webflow with Twilio Segment

Webflow is great for shipping marketing sites fast, but the built-in analytics story is thin. I put together a Twilio Segment recipe walking through how to drop Segment's Analytics.js into a Webflow project so you can capture page views and structured custom events from CMS-backed templates, all without leaving the Webflow designer. The full how-to lives on Twilio.com. What follows is the short version with my notes.

The shape of the integration

Two surfaces in Webflow do the heavy lifting: the site-wide “Custom Code” block in Project Settings, and the per-template Custom Code field labeled “Before body tag close” on CMS templates. The site-wide block is where Segment’s Analytics.js snippet goes so it loads on every page. The per-template block is where you fire structured track() calls for specific page types like a Blog Post template.

Both surfaces require the paid Webflow tier. Custom Code isn't exposed on the free plan.

A small tweak: trim the page name

The standard Segment snippet fires analytics.page() automatically using document.title. Webflow tacks “| Site Name” (or similar) onto the title by default, which makes the page name in Segment's debugger noisy. Trimming to the first segment before the dash and passing it explicitly to analytics.page() gives you cleaner names without losing anything important.

Per-template track calls

On CMS-backed templates, drop an analytics.track() call into the per-template Custom Code field (Webflow labels it “Before body tag close”). The “+ Add Field” inserter pulls in CMS fields as variables, so you can populate the event’s properties with the actual title, slug, category, etc. for the post being viewed. The event then fires every time someone lands on a page rendered by that template. Repeat the pattern for any CMS collection you care about, like Books, Trips, Products, or whatever your site uses.

Takeaway

Webflow's Custom Code surfaces are limited compared to a full code editor, but they're enough to wire Segment in cleanly and get structured events flowing without engineering involvement. Once page calls are in, every CMS template is a place where you can layer event tracking like clicks, hovers, and form submits using the same pattern.

The original recipe

Step-by-step walkthrough with code snippets and screenshots: Gathering data from your Webflow site using Twilio Segment on Twilio.com.