Tracking

1 views

6 min

Track where your conversions come from with UTM parameters in Webflow

Video

UTM parameter	JS variable	Usage
utm_source	utmSource	Original platform (Google, Facebook, LinkedIn...)
utm_medium	utmMedium	Channel type (CPC, email, social...)
utm_campaign	utmCampaign	Campaign name
utm_content	utmContent	Content variant (A/B test)

In this episode, Sandro, co-founder of the Gemeos Webflow agency, shows you how to track where your conversions come from using UTM parameters in Webflow.

1. Add the custom code to capture the UTM parameter and store it in session

Add this custom code to the head of each of your landing pages

2. Add fields to your form to pass along the UTM parameters

Make sure you set these fields to display: none. Your leads don't need to see them, and showing them could hurt your conversion rate.

3. Add an ID to each field you use to pass along values

‍

4. Add the custom code to display the UTM parameter in your form fields

 < script>
// Get the HTML element corresponding to the form field
var leadSource = document.getElementById("leadSource");
// Update the HTML element value to display firstPage
leadSource.value = utmSource;

Make sure you replace "leadSource" with the ID value you set earlier

Good to know

To track all UTMs at once, duplicate the script for each parameter. This technique works with native Webflow forms and third-party tools like Tally or HubSpot Forms.

5. Publish your site and test the result

‍

Track where your conversions come from with UTM parameters in Webflow

Video

1. Add the custom code to capture the UTM parameter and store it in session

2. Add fields to your form to pass along the UTM parameters

3. Add an ID to each field you use to pass along values

4. Add the custom code to display the UTM parameter in your form fields

5. Publish your site and test the result

Heading

Lorem ipsum dolor sit amet consectetur.

Lorem ipsum

Similar tutorials