Autofill with Cookie Value

[Trevor_Parsell]

Hey All,

We have many scenarios where it makes sense to use URL Parameters and Referrer Parameters to fill hidden fields, but we are not using the Cookie Values option for anything.

What are the standard use-cases and best practices for using Cookie Values to auto-fill Marketo form fields? I am just looking to understand this at a high level to make sure we can make the most of this functionality.

Thanks!

[Josh_Hill13]

Sanford Whiteman​ probably knows.

Sounds like you could force a cookie ID to pass over to a field.

[SanfordWhiteman]

You use Cookie Value when you're purposely persisting values in cookies to pass them around your site -- by far the most common use is to save initial utm_* query params and then restore them into forms later.

[Anonymous]

Pretty much. We do that so that we can track initial utm all across the website rather than just the landing page, as well as prevent from having  it overwritten by consequent utms.

[Trevor_Parsell]

Thanks, Sanford. That makes sense and is exactly what we would like to do!

I am new to using cookies. How do you go about setting this up to capture "Original utm" values that can later be accessed when a form is submitted? Our plan is to capture "First utm" values for all form submits.

[Anonymous · Accepted solution]

I'm not Sanford, but maybe you'll find this JS useful. Just don't forget to update domain name.

This script saves UTM parameters in cookies whenever there are any UTM parameters in the URL. It also saves the initial referrer information in a cookie which is ever (365 days) overwritten.  The values in the cookies can be read and added to forms or stored in the backend database, etc.

var utmCookie = {

  cookieNamePrefix: "",

  utmParams: [

  "utm_source",

  "utm_medium",

  "utm_campaign",

  "utm_term",

  "utm_content"

  ],

  cookieExpiryDays: 365,

  // From http://www.quirksmode.org/js/cookies.html

  createCookie: function (name, value, days) {

  if (days) {

  var date = new Date();

  date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000));

  var expires = "; expires=" + date.toGMTString();

  } else

  var expires = "";

  document.cookie = this.cookieNamePrefix + name + "=" + value + expires + "; domain=.abilitynetwork.com; path=/";

  },

  readCookie: function (name) {

  var nameEQ = this.cookieNamePrefix + name + "=";

  var ca = document.cookie.split(';');

  for (var i = 0; i < ca.length; i++) {

  var c = ca[i];

  while (c.charAt(0) == ' ')

  c = c.substring(1, c.length);

  if (c.indexOf(nameEQ) == 0)

  return c.substring(nameEQ.length, c.length);

  }

  return null;

  },

  eraseCookie: function (name) {

  this.createCookie(name, "", -1);

  },

  getParameterByName: function (name) {

  name = name.replace(/[\[]/, "\\\[").replace(/[\]]/, "\\\]");

  console.log(name);

  var regexS = "[\\?&]" + name + "=([^&#]*)";

  var regex = new RegExp(regexS);

  var results = regex.exec(window.location.search);

  if (results == null) {

  return "";

  } else {

  return decodeURIComponent(results[1].replace(/\+/g, " "));

  }

  },

  utmPresentInUrl: function () {

  var present = false;

  for (var i = 0; i < this.utmParams.length; i++) {

  var param = this.utmParams[i];

  var value = this.getParameterByName(param);

  console.log(param + ' = ' + value);

  if (value != "" && value != undefined) {

  present = true;

  }

  }

  return present;

  },

  writeUtmCookieFromParams: function () {

  for (var i = 0; i < this.utmParams.length; i++) {

  var param = this.utmParams[i];

  var value = this.getParameterByName(param);

  this.writeCookieOnce(param, value)

  }

  },

  writeCookieOnce: function (name, value) {

  var existingValue = this.readCookie(name);

  if (!existingValue) {

  this.createCookie(name, value, this.cookieExpiryDays);

  }

  },

  writeReferrerOnce: function () {

  value = document.referrer;

  if (value === "" || value === undefined) {

  this.writeCookieOnce("referrer", "direct");

  } else {

  this.writeCookieOnce("referrer", value);

  }

  },

  referrer: function () {

  return this.readCookie("referrer");

  }

};

utmCookie.writeReferrerOnce();

if (utmCookie.utmPresentInUrl()) {

  utmCookie.writeUtmCookieFromParams();

}

[Trevor_Parsell]

Thanks, Paul! This is very helpful!

So in the script above I would just need to replace".abilitynetwork.com" with my domain name? And then just add this to any pages we want to track?

When pulling the initial referrer information into the form, how do I make sure I am differentiating between the "First UTM" and "Last UTM" values and attaching both to the lead record upon submit? What is a good way to test this once it is in place?

Thanks!

[SanfordWhiteman]

When pulling the initial referrer information into the form, how do I make sure I am differentiating between the "First UTM" and "Last UTM" values and attaching both to the lead record upon submit? What is a good way to test this once it is in place?

This script doesn't record multiple previous (i.e. not on the current URL) utm_* params.

But it would let you map one set of saved cookie params to a corresponding set of Marketo fields and the current page's query params to another set of Marketo fields (just set the source of the Hidden field). If there weren't any params from previous pages, the field sets will be identical.

[Trevor_Parsell]

Hey Sanford,

Just to make sure i understand this, you are saying I should be able to pull the original utm_source from the cookie value and the "last" utm_source from the URL Parameters, correct?

For Original UTM values:

For Last UTM values:

[SanfordWhiteman]

Exactly!