Beam for Webflow

Add Beam to Webflow from Project Settings in minutes. Track page performance, channels, and content without cookies, consent banners, or script-heavy tag managers.

Get started free Explore live demo

No credit card required and setup in minutes

Install Beam on Webflow

Replace YOUR_SITE_ID with your Beam site ID from the dashboard.

Project-wide install in Webflow Custom Code

<!-- Webflow: Project Settings -> Custom Code -> Head Code -->
<script
  defer
  src="https://beam.keylightdigital.dev/js/beam.js"
  data-site-id="YOUR_SITE_ID">
</script>

This is the recommended placement for Webflow so Beam loads on every static page, CMS template page, and collection item.

Page-level install for limited rollout

<!-- Webflow Designer: Page Settings -> Custom Code -> Inside <head> -->
<script
  defer
  src="https://beam.keylightdigital.dev/js/beam.js"
  data-site-id="YOUR_SITE_ID">
</script>

Use page-level code for staged rollouts, then move to project-level installation once validated.

Verify your Webflow integration

Use this checklist after publish so you know tracking is actually live in production.

✓ Publish the Webflow site after adding code; draft/preview mode does not represent production tracking.
✓ Visit your homepage and one CMS page in a private window.
✓ In Beam dashboard, confirm both URLs appear and referrer/country values are populated.

Why Beam works well for Webflow

🍪

No cookie-banner complexity

Beam is cookieless and avoids consent-banner prompts that hurt conversion on marketing sites.

⚡

Fast marketing pages stay fast

Sub-2KB script with defer loading preserves Lighthouse and Core Web Vitals performance goals.

🛠

No-code friendly install

Everything happens in Webflow settings without touching source code or external tag managers.

📈

Actionable channel visibility

Understand top pages, referrers, and traffic channels to make content and landing page decisions faster.