Skip to main content
Add DATALYR to your Webflow site to track visitors, conversions, and revenue from ads.

Use Cases

E-commerce Stores Track product views, cart additions, and purchases. See which Meta or Google ads drive sales. Lead Generation Capture form submissions and attribute leads back to campaigns. Track demo requests and newsletter signups. Portfolios & Agency Sites Track visitor behavior, traffic sources, and contact form conversions.

Before You Start

  • You have a DATALYR account
  • You’ve created a workspace
  • You have Editor access to your Webflow project

Step 1: Get Your Tracking Code

  1. Log in to your DATALYR dashboard
  2. Go to Settings → Tracking
  3. Copy your tracking script:
<script
  defer
  src="https://track.datalyr.com/dl.js"
  data-workspace-id="YOUR_WORKSPACE_ID">
</script>

Step 2: Add to Webflow

  1. Open your Webflow project
  2. Click the Settings icon (gear) in the left sidebar
  3. Go to the Custom Code tab
  4. Scroll to Head Code section
  5. Paste your DATALYR tracking script
  6. Click Save Changes

Step 3: Publish Your Site

Your tracking script is only added to the published site, not the Designer preview.
  1. Click Publish in the top right
  2. Select your domain
  3. Click Publish to selected domains

Step 4: Verify Tracking Works

  1. Visit your published Webflow site in a new browser tab
  2. Go back to your DATALYR dashboard
  3. Click Events in the sidebar
  4. You should see a page_view event within 10 seconds
If you see events, you’re done! DATALYR is tracking.

What Gets Tracked Automatically

Once installed, DATALYR automatically captures:
  • Page views on every page
  • Visitor IDs (persistent across sessions)
  • UTM parameters from ad campaigns
  • Ad click IDs (fbclid, gclid, ttclid)
  • Referrer and traffic source
  • Device and browser information

Track Webflow Form Submissions

To track form submissions as conversion events, add this code to your form’s success state:
  1. Select your form in the Webflow Designer
  2. Go to Form Settings
  3. Add this to Success Message (use an Embed element):
<script>
  if (window.datalyr) {
    datalyr.track('form_submission', {
      form_name: 'Contact Form',
      page: window.location.pathname
    });
  }
</script>
Replace 'Contact Form' with your actual form name.

Track E-commerce Events (Webflow Ecommerce)

If you’re using Webflow Ecommerce, track purchases:
  1. Go to your Order Confirmation page
  2. Add an Embed element
  3. Paste this code:
<script>
  if (window.datalyr && window.Webflow && window.Webflow.commerce) {
    const order = window.Webflow.commerce.order;
    if (order) {
      datalyr.track('purchase', {
        order_id: order.orderId,
        revenue: order.total,
        currency: order.currency,
        items: order.purchasedItems.map(item => ({
          id: item.sku,
          name: item.name,
          price: item.price,
          quantity: item.count
        }))
      });
    }
  }
</script>
This sends purchase events to DATALYR with order details.

Troubleshooting

Not seeing events? Check that:
  • Your tracking script is in the Head Code section (not Footer Code)
  • You’ve published your site (tracking doesn’t work in Designer preview)
  • Your workspace ID is correct
  • Ad blockers are disabled
Events showing in test mode? Webflow staging sites work fine. Just make sure you published after adding the code. Form tracking not working? Make sure the script is in the form’s success state, not the form itself. It only fires when the form is successfully submitted.

Next Steps

Need Help?

Can’t get tracking working on Webflow? Check our troubleshooting guide or contact support.