SourceTag

Form Setup

Set up SourceTag with Webflow Forms

Webflow’s native forms render as standard HTML, which makes adding hidden fields straightforward. You add hidden <input> elements using an Embed element inside the form, or by using Webflow’s custom attributes.

What you need

  • SourceTag installed on your Webflow site (added via Project Settings > Custom Code, or in the page head)
  • A Webflow form on your page

Step 1: Open the page in the Webflow Designer

Open the Webflow Designer and navigate to the page with your form.

[IMAGE: Screenshot of Webflow Designer showing a form on the canvas]

Step 2: Add an Embed element inside the form

  1. In the Webflow Designer, select your Form Block (click on the form)
  2. Inside the form, add an Embed element (find it under Components or press Cmd/Ctrl + E and search “Embed”)
  3. Place the Embed element inside the form block, typically before the submit button

[IMAGE: Screenshot of Webflow Designer with Embed element being added inside a form]

Step 3: Add hidden input fields

In the Embed element’s code editor, paste the following hidden inputs:

<!-- SourceTag core fields -->
<input type="hidden" name="st_fc_channel" value="">
<input type="hidden" name="st_fc_detail_1" value="">
<input type="hidden" name="st_fc_detail_2" value="">
<input type="hidden" name="st_fc_detail_3" value="">
<input type="hidden" name="st_fc_detail_4" value="">
<input type="hidden" name="st_lc_channel" value="">
<input type="hidden" name="st_lc_detail_1" value="">
<input type="hidden" name="st_lc_detail_2" value="">
<input type="hidden" name="st_lc_detail_3" value="">
<input type="hidden" name="st_lc_detail_4" value="">
<input type="hidden" name="st_fc_landing_page" value="">
<input type="hidden" name="st_lc_landing_page" value="">

<!-- SourceTag optional fields -->
<input type="hidden" name="st_fc_click_id" value="">
<input type="hidden" name="st_lc_click_id" value="">
<input type="hidden" name="st_visits" value="">
<input type="hidden" name="st_days_to_convert" value="">
<input type="hidden" name="st_device" value="">

Remove any optional fields you do not need.

[IMAGE: Screenshot of Webflow Embed element code editor with hidden inputs pasted]

Step 4: Save and publish

Save the Embed element and publish your site. The hidden inputs are now part of the form’s HTML. SourceTag will find them by their name attribute and populate them.

Step 5: Test

Visit the page with UTM parameters:

?utm_source=test&utm_medium=cpc&utm_campaign=webflow-test

Submit the form. Check the form submission in your Webflow dashboard (or wherever your form submissions go, such as an email notification or Zapier integration). The hidden fields should contain your attribution data.

[IMAGE: Screenshot of Webflow form submission showing populated hidden fields]

Tips

  • The Embed element must be inside the Form Block, not outside it. If it is outside, the hidden inputs will not be submitted with the form.
  • Webflow form submissions include all fields, including hidden ones. They will show up in the Webflow dashboard under the form’s submissions tab.
  • If you are using a third-party form handler (like Zapier, Make, or a webhook), the hidden field values will be included in the form data payload.
  • You can also set hidden inputs using Webflow’s custom attributes feature on regular form fields, but the Embed method is simpler and more reliable.
  • Because Webflow forms are standard HTML, this is one of the most straightforward integrations.