← Back to Docs

Webflow Setup Recipe

Integrate the tracking pixel into your Webflow site settings to track visitors site-wide.

Who This Is For

This guide is for designers and marketers who build and manage websites using Webflow, and want to quickly add first-party conversion tracking without needing to code.

Key Terms Defined:

  • Head Code — a settings panel in Webflow where you can inject custom scripts that run before the webpage's body contents load.
  • Site-wide — code that runs on every page of your domain (e.g. landing pages, blog posts, contact pages).

What You Will Set Up

You will add our base tracking snippet into your Webflow dashboard settings and publish the changes to establish standard pageview and acquisition parameter tracking.

Steps: Webflow Integration

  1. Log in to your Webflow Dashboard and open your site settings.
  2. Navigate to the Custom Code tab in the settings menu.
  3. Scroll to the Head Code section and paste the following snippet:
    <script async src="https://api.srctk.com/tracker.min.js" data-site-key="YOUR_SITE_KEY"></script>
  4. Click Save Changes.
  5. Click Publish at the top right of your Webflow editor to make the tracking pixel active on your live domain.

How to Verify It Worked

  1. Visit your live Webflow website.
  2. Open Developer Tools (right-click → Inspect), click the Network tab, and filter by typing track.
  3. Refresh the page and check that a successful call to POST /api/track executes.
  4. Verify incoming pageviews appear instantly in the SourceTrack dashboard Event Debugger.

Common Mistakes

  • Forgetting to Publish: Webflow custom code settings are only deployed when you click the Publish button in Webflow.
  • Pasting in Footer Code instead of Head: Ensure the script is placed inside the Head Code box so acquisition signals are loaded before page view behaviors begin.

Next Step

Now that base tracking is active, set up conversion triggers for forms, button clicks, or demo calendars. Refer to ourBrowser Conversions guidefor recipes.