How to capture UTM parameters in Framer forms

Learn the 4 simple steps to capturing UTM parameters in your Webflow forms and sending them into your CRM, analytics tools and more.

Framer - UTM Parameters

Are you running paid ad campaigns on Google, Facebook, etc and struggling to track how many leads & customers you're getting from them?

You're not alone. Tools like Google Analytics are great for understanding how many website visitors you're getting, but they can't really tell you how many leads you got, which ones converted to customers, how much revenue was generated, etc.

There is a way though. By capturing UTM parameters with each form submission and sending them to your CRM and other tools, you're able to run reports that tell you exactly how many leads & customer syour ads are generating.

In this article, we'll walk you step-by-step through how to use a tool called Attributer to capture UTM parameters in Framer forms, as well as show you some example reports you can run once you've got it all setup.

4 steps for capturing UTM parameters in Framer forms

When you use Attributer, capturing UTM parameters in Framer couldn’t be easier. These are the four steps you’ll need to follow:

1. Install Attributer on your site

Add Attributer Code to Site Mobile

When you sign up for a 14-day free trial of Attributer, you'll get given a small snippet of code to add to your website.

To add it to your Framer site, simply head to the Settings section and scroll to the bottom of the 'General' tab.

You'll see a section called 'Custom Code' where you can paste it in.

2. Add hidden fields to your forms

Step 2

Step two involves adding a set of hidden fields to your forms.

As the name implies, hidden fields aren’t visible to site visitors but are still present on the form. This means that tools like Attributer write information into them (like the UTM parameters) without anyone noticing.

Below are the hidden fields you’ll need to add:

  • Channel
  • Channel Drilldown 1
  • Channel Drilldown 2
  • Channel Drilldown 3
  • Landing Page
  • Landing Page Group

You can find further instructions on how to add hidden fields to Framer forms here.

3. Attributer automatically completes the hidden fields with UTM data

Step 5

Now that everything is set up, Attributer will start to track where your website visitors are coming from and when they complete a form on your website, it will write the data into the hidden fields.

To give you an idea of how Attributer works, let’s consider an example. Let’s say you’re a marketing manager at a consulting firm.

A potential client might search Google for “business consulting services Melbourne”. In the search results, they see your paid search ad and click on it. They then land on your website and fill out a form.

Depending on the UTM parameters you attached to the ad, Attributer might fill the hidden fields in like this:

  • Channel = Paid Search
  • Channel Drilldown 1 = Google
  • Channel Drilldown 2 = Consulting Campaign
  • Channel Drilldown 3 = Business Consulting

Not only that, but Attributer also logs the specific landing page and group where the visitor entered:

  • Landing Page = www.consultingfirm.com.au/services/business-consulting
  • Landing Page Group = Services

4. UTM parameters are captured in Framer

Step 4

Lastly, when someone submits the form, both their personal details (e.g. name, email address, phone number) and the UTM parameters are captured in Framer.

From there, you can do a number of things:

  • See the UTM parameters next to each form submission in a connected Google Sheets (Framer has a built-in integration with Google Sheets)
  • Connect a tool like Google Data Studio or Microsoft Power BI to the spreadsheet and build reports & dashboards.
  • Use a tool like Zapier to send the UTM parameters to your CRM (including Salesforce, Pipedrive, Zoho CRM, Hubspot & more) and then use the data to build reports & dashboards there.

What is Attributer?

Put simply, Attributer is a small bit of code you install on your website.

Once it’s in place and someone lands on your website, Attributer will analyse various technical details to determine where they came from (the same things as tools like Google Analytics look at).

Attributer will then use these details to categorise that user into “Channels” (such as Paid Social, Paid Search, or Organic Search). It then securely stores this data in the user’s browser.

When someone completes one of your Framer forms, Attributer auto-completes the hidden fields with the stored data on how that person found your website. After the form has been submitted, this data is captured in Framer alongside the lead’s personal details (e.g., the name, email address, phone number, etc, they entered into the form).

Founded by a seasoned marketing executive, Attributer is now used on thousands of websites, tracking over 8 million visitors each month.

Why using Attributer is better than capturing raw UTM parameters

You might have encountered other methods for capturing UTM parameters in Framer forms. So, what sets Attributer apart?

Let’s break it down:

1. Captures all traffic

Attributer is much more comprehensive than other UTM tracking methods. This is because it monitors the source of ALL your leads, not just those from your paid advertising campaigns with UTM parameters.

So, whether someone finds your site through Organic Social, Paid Social, Organic Search, Referral, etc., Attributer will gather information about where they came from and pass it through to you whenever they complete a form.

2. Remembers the data across pageviews & sessions

Several other tools for capturing UTM parameters only work if the form is submitted on the same page they originally land on.

So if they land on your homepage but then navigate to your Contact Us page and complete a form there, no information would be passed through.

Attributer helps you avoid this issue by storing the UTM parameters within the user’s browser. As a result, the original UTM data gets passed onto you, no matter which page the visitor submits the form on.

3. Provides cleaner data

Capturing raw UTM parameters can present challenges, as the data is often disorganized and inconsistent.

For instance, consider a scenario where some of your Google Ads campaigns are tagged with UTM_medium= adwords, others with UTM_medium=ppc, and still others with UTM_medium=cpc.

It sounds silly, but it can easily happen if different people or agencies have managed your ads over time.

If you were to just capture these raw UTM parameters and try to use them to run reports, these would appear as three separate lead sources, meaning you'd have to manually consolidate them in order to get a true understanding of how many leads you got from your Google Ads

Attributer addresses this issue though. It is specifically designed to recognize variations in capitalization and other UTM parameter inconsistencies and would still be able to categorise these leads into the correct channel (Paid Search in this case).

4. Captures landing page data as well

Attributer not only captures UTM parameters but it also records the lead's landing page and landing page group.

For example, if a lead arrives at attributer.io/blog/capture-utm-parameters, Attributer would capture the full landing page URL (attributer.io/blog/capture-utm-parameters) as well as the landing page group (I.e. /blog).

This means that you can run reports that show what content on your site is attracting leads & customers.

3 example reports you can run when you capture UTM parameters in Framer forms

If you use Attributer to capture UTM parameters in Framer forms, and you send it to your CRM, you can generate a range of reports designed to show you how effective your promotions have been.

Having worked in marketing and analytics for more than 15 years, I’ve developed hundreds of these reports. Here are four of my favourite formats I recommend you start with:

1. Leads by Channel

Leads By Channel (5)

Because Attributer tracks the source of ALL your leads, you can create reports that display lead counts categorised by channel.

These reports are extremely useful for identifying which channels are most effective at driving leads and where additional investment might be needed.

For example, you might find that most of your leads are coming from Paid Search even though most of your budget is going towards social media ads. Informed by this data, you may opt to strategically rejig your budget.

2. Leads by Facebook Ads Network

Leads By Facebook Ad Network

If you’re running ads on Meta, they’re likely showing up across various platforms (such as Facebook, Messenger, Instagram, etc.). This report compares how many leads each one is delivering for your business so you can see at a glance which ones are most effective.

You can then optimise your ad spend accordingly to boost your overall number of leads while also lowering your cost per lead.

3. Customers by Google Ads campaign

Customers by Google Ads Campaign

This report shows you how many customers you gain each month from your Google Ads campaigns. It provides valuable insights into which campaigns are driving real customers for your business (as opposed to just attracting website visitors who don’t convert).

With this information, you can refine your Google Ads strategy, adjust your budget as needed, and conduct A/B testing to see how you can improve your campaigns.

Wrap up

If you’re looking for a better way to capture UTM parameters in Framer forms, Attributer could be a great option.

Plus, with a 14-day free trial available, there’s nothing to lose by testing it out. Claim your complimentary trial now to see if Attributer is the right fit for you.

Get Started For Free

Start your 14-day free trial of Attributer today!

aaron-beashel

About the Author

Aaron Beashel is the founder of Attributer and has over 15 years of experience in marketing & analytics. He is a recognized expert in the subject and has written articles for leading websites such as Hubspot, Zapier, Search Engine Journal, Buffer, Unbounce & more. Learn more about Aaron here.