16 Replies Latest reply on Oct 4, 2017 4:28 PM by Yanir Calisar

    Solution to using UTM parameters & cookies to capture lead source information

      *** NOTE: As Sanford pointed out in his post below, my code below has flaws and should be improved upon. I offer this only as an explanation of what worked for my purposes at the time. My team ended up not needing to capture this info, so I never went back and updated my code. Use it at your own risk. ***

       

      I scoured these forums as well as myriad other sites and pages for weeks to figure out how to capture the original referral source of a user’s first visit, even if they don't convert at that time. But I never found a complete solution I could implement since I am not an experienced developer.  Therefore, in order to save others from the frustration I experienced, I offer the following detailed explanation of what finally worked for me. Specifically, this is how I was able to set the values from a URL with UTM parameters as cookies so a visitor’s original referral source could be captured.

       

      For example, a new user comes to a demo signup form on a Marketo landing page from a LinkedIn ad containing UTM parameters. He leaves the page without filling out the form and visits our company’s main website.  He then later returns and completes a whitepaper request form. We want to know that he originally came from the LinkedIn ad.

       

      Alternately, if you are sending users to your main website and want to pass UTM values to a Marketo form once they land on a Marketo landing page, uncomment the following line in the code.  (Don't forget to change "example.com" to your domain.)

       

      document.cookie = key + "=" + query[key] + ";domain=.example.com;path=/";

       

      Put the code below on your form pages.  (I know there are more efficient ways of writing it, but I don't have the Javascript skills to do so.)  You must have hidden fields on the forms to capture the UTM parameters.  When setting up the hidden fields on the form be sure to set Get Value from in the Autofill settings as “Cookie Value”.

       

      In this example I have “utm_source”, “utm_campaign”, “utm_medium”, “utm_term”, and “utm_content” as hidden fields on my form.

       

      Put the following in the <head> of your page:

       

      <script type="text/javascript">

       

      //This grabs the UTM parameters from the URL

       

      function getQueryParams(qs) {

       

          qs = qs.split("+").join(" ");

       

          var params = {}, tokens,

          re = /[?&]?([^=]+)=([^&]*)/g;

       

          while (tokens = re.exec(qs)) {

      params[decodeURIComponent(tokens[1])] = decodeURIComponent(tokens[2]);

          }

       

          return params;

      }

       

      //This sets the cookies

       

      var query = getQueryParams(document.location.search);

       

      for (var key in query) {

       

      //console.log(key, query[key]);

       

        document.cookie = key + "=" + query[key];

       

      //Setting domain and path attributes allow cookies to be read across subdomains

      //To have a cookie available to all subdomains, you must put a . in front of your domain.

      //Setting the path=/ will have the cookie be available within the entire specified domain.

      //Don't forget to change "example.com" to your domain.

       

      //document.cookie = key + "=" + query[key] + ";domain=.example.com;path=/";

       

      }

       

      //This gets the cookies

      //ID = MARKETO FIELD NAME

       

      var elem = document.getElementById("utm_source");

      var elem2 = document.getElementById("utm_campaign");

      var elem3 = document.getElementById("utm_medium");

      var elem4 = document.getElementById("utm_term");

      var elem5 = document.getElementById("utm_content");

      elem.value = query.utm_source;

      elem2.value = query.utm_campaign;

      elem3.value = query.utm_medium;

      elem4.value = query.utm_term;

      elem5.value = query.utm_content;

       

      //This runs the script when the page loads so the hidden fields are automatically populated

       

      window.onload = getQueryParams;

       

      </script>