Home | Forms | Pre-fill Forms from Links or Webpages, Part 2: Using Hidden Fields

Pre-fill Forms from Links or Webpages, Part 2: Using Hidden Fields

In a previous blog post, we described how you can pre-fill forms using URL parameters and a little Javascript. In that example, we generated URL parameters for First Name and Last Name in an email link, and when the recipient clicked the link, it pre-filled the corresponding form with their name. To take this concept a little further, we want to share another example where we used URL parameters to pre-fill a hidden field on a form to track the source of a lead.

Please note: The custom code in this blog post is provided as-is and ClickDimensions does not provide support on the implementation of this code.

SCENARIO:

When we create a content marketing campaign, we will have a dedicated landing page and form to collect leads generated by that campaign. In addition, it’s important for us to track where each lead originated. A hidden field for Lead Source easily tracks this information. We set the Lead Source value (“AdWords” for example) on the form and that information is automatically passed as the form is submitted.

Pic1

And that works great – for one lead source. However, we will typically advertise a content piece on a variety of different online advertising platforms (Google AdWords, Facebook, LinkedIn, etc.).  Managing separate landing pages and forms for each ad platform would be a hassle, so we needed a way to capture different values for our hidden Lead Source field based on where the visitor came from.

SOLUTION:

When we create URLs for our ads (often called destination URLs), we include a parameter for Lead Source along with our other tracking parameters. An example URL for an AdWords ad would look like this:

http://www.clickdimensions.com/ebook/?utm_medium=ppc&utm_campaign=ebook&leadsource=adwords

The leadsource parameter would change for each ad platform:

http://www.clickdimensions.com/ebook/?utm_medium=ppc&utm_campaign=ebook&leadsource=facebook

Using the Javascript described in our earlier post, we are able to get the Lead Source parameter from the URL and insert the value into our form:

Pic2
This Javascript code is inserted into the Code Editor window inside the Form Builder:

Pic3

Pic4

Step-by-step instructions for how to create the Javascript code for your specific form fields can be followed here.

Using Widgets

Note: If you are embedding your form into a web page using a widget, you will need to insert the Javascript code directly into the HTML of your page (with the widget code), not into the Code Editor. Remember to include the <script> tags:

Pic5

RESULT:

Now, when a visitor clicks one of our ads, the Lead Source is automatically captured in CRM. This allows us to easily measure and evaluate the traffic coming from each advertising platform for each campaign.

 

2018-05-31T14:47:35+00:00 By |Forms, Landing Pages, SEO/SEM|2 Comments

About the Author:

mm
Heather Robertson is Senior Director of Partner Marketing and Programs at ClickDimensions.

2 Comments

  1. Jodi Lee September 19, 2017 at 1:27 pm - Reply

    Really like this idea! We set up the javascript and everything works fine if we have the URL as such http://www.clickdimensions.com/ebook/?utm_medium=ppc&utm_campaign=ebook&source=facebook. However, all of our tracking codes on our marketing efforts (including ClickDimensions emails) include “utm” before everything including “source”, so the URL would actually be http://www.clickdimensions.com/ebook/?utm_medium=ppc&utm_campaign=ebook&utm_source=facebook. The UTM is causing the issue of not allowing “facebook” to populate the source field on the lead record.

    Is there a way around this?

    • mm
      ClickDimensions Marketing September 26, 2017 at 2:07 pm - Reply

      Glad you like it, Jodi! To answer your question, make sure that in the JavaScript code, in every instance of the source parameter it is written as “utm_source”. In our example in the blog post we use “leadsource” throughout the code. That would be changed to “utm_source” to work with your links.

Leave A Comment