Get Started Log in
Docs / Webflow

Webflow

Webflow does not pass traffic source into form submissions. Sourcream adds it: first and last source, medium and campaign plus a visitor ID go into every Webflow form, and the lead lands in your CRM with its source.

1. Add the script

  1. In Sourcream, open Sites, your site, Install and copy the script tag.

  2. In Webflow, open Site settings, Custom code, Head code and paste it:

    <script src="https://cdn.sourcream.ai/t/YOUR_SITE_KEY.js" async></script>
    
  3. Save, then Publish to every domain you use.

Use the site-wide Head code, not a page's custom code, so the script also runs on landing pages without forms.

2. Forms

Nothing more is needed for most sites. The script adds hidden inputs named first_source, first_medium, first_campaign, last_source, last_medium, last_campaign and sc_visitor_id to every form when the page loads, and Webflow submits them with the other fields. They appear in Form submissions and in Zapier once a submission includes them.

If you prefer the fields to be part of the form in the Designer (for example so they are visible to anyone editing the form), add a Code Embed inside the form with the hidden fields from the Install tab:

<input type="hidden" name="first_source">
<input type="hidden" name="first_medium">
<input type="hidden" name="first_campaign">
<input type="hidden" name="last_source">
<input type="hidden" name="last_medium">
<input type="hidden" name="last_campaign">
<input type="hidden" name="sc_visitor_id">

The embed must sit inside the form: the canvas breadcrumb has to read Form > Embed, not Form Block > Embed. Outside the form, the inputs are not submitted. Auto inject (on by default) fills existing inputs and only adds the ones that are missing, so leaving it on is safe.

3. Lead capture

Each submission is sent to Sourcream from the browser as it happens. For capture that does not depend on the visitor's browser at all, also send Webflow's form webhook to Sourcream:

  1. In Sourcream, the site's Webhook intake tab shows the intake URL once when the site is created (rotate it there to see a new one). It looks like https://cdn.sourcream.ai/hooks/....
  2. In Webflow, open Site settings, Apps & integrations, Webhooks, choose Add webhook, trigger type Form submission, and paste the intake URL.

Sourcream reads the submission (payload.data), uses sc_visitor_id to find the visitor's full attribution, falls back to the hidden field values when the visitor is unknown, and uses Webflow's submission id to avoid duplicates. When the browser beacon and the webhook both arrive for the same submission, they are merged into one lead and counted once.

4. Zapier and Monday.com

If your forms run through Zapier (Webflow to Monday.com, for example), the hidden fields arrive as normal form fields. Zapier only discovers new fields from a real submission:

  1. Publish the site.
  2. Submit a test from the live site with UTMs on the URL, for example ?utm_source=test&utm_medium=test&utm_campaign=zapier.
  3. In the Zap, click Test trigger and pick that submission.
  4. In the Monday.com step, refresh fields (Re-test forces a fresh board schema), then map each value to a Text column. Status and Dropdown columns reject values that are not predefined.

More in Zapier, Monday.com and webhooks.

5. Check it

Open the published site (not the Designer) in a private window with ?utm_source=test&utm_medium=test&utm_campaign=install, run Sourcream.read() in the console, inspect the form's hidden inputs, submit, and check Leads in Sourcream.

Webflow gotchas

  • Custom code only runs on the published site, never in the Designer preview.
  • Testing on yourproject.webflow.io: add that host under the site's Own domains in Sourcream, or its data is refused. It does not count towards your plan's domains. Leave Cookie domain empty for it: webflow.io is a shared host and browsers reject cookies scoped to it. Set the Cookie domain to your apex only on your own domain.
  • Typeform embeds: in the Head code, write defer instead of async in the Sourcream tag, or Typeform can start before the hidden values are set (Typeform and Gravity Forms).
  • Sourcream is not defined in the console means the head script did not load: the site was not published, the <script> tags are missing, or the paste broke.
  • requestIdleCallback and SVG width or height errors in the console come from Webflow, not Sourcream.
  • Webflow hosting cannot proxy a path, so Webflow sites run in standard mode (script and data on cdn.sourcream.ai). First touch is still stored on our servers, but Safari limits the visitor ID cookie to 7 days. See First-party proxy.
  • Moving from the LeadAttr script: remove the old head script and footer snippet, keep your hidden inputs (the names are the same), and turn on Read legacy LeadAttr cookies in the site settings so returning visitors keep their first touch.

Questions: [email protected]

Stuck on an install? Email [email protected] with your site address and what you are seeing, and we will help you get it working.