Revely logo
Zero-Party Data

Capturing UTMs with Javascript and MCAE Form Handlers

If you invest in paid advertising and use UTM parameter tracking, capturing that data in Salesforce and Marketing Cloud Account Engagement can help you uncover real-time Sales insight into the best performing marketing tactics with the highest ROI. To get started, there are a handful of configurations that will need to occur in Marketing Cloud Account Engagement (fka Pardot) and on your website.

CREATING A FORM HANDLER FOR UTM FIELDS

The first step to capturing UTM parameter data is creating the corresponding fields in MCAE on the Prospect record, and in Salesforce on the Lead record. You should have five fields created for UTM_Source, UTM_Medium, UTM_Campaign, UTM_Term, UTM_Content. If you use a multi-touch attribution model, consider duplicating, renaming and hiding a version of the fields that capture UTM data at the time the lead is first created. This allows your visible UTM fields to be overwritten with the most recent conversion, while preserving the initial conversion data.

Once your fields are created and synced correctly between MCAE and Salesforce, you can create your Form Handler. Add the UTM fields to your Form Handler as normal, with the data input set to text. Do not mark the fields as required in MCAE, if you do so in the form handler configuration and have them required on your website your form will not submit successfully. When your Form Handler is complete, copy the unique form handler code and match it to the form tag on your site.

For example, your form handler should look like the form below: 

PARSING UTM PARAMETER DATA INTO FORM FIELDS

The form input fields that hold your UTM parameter data and pass it along to Account Engagement will be hidden on your webpage. Therefore, you’ll need to use JavaScript to dynamically scrape the data from the webpage url and place it in the appropriate form fields to send to Account Engagement. Insert the following JavaScript snippet as close to the closing </body> html markup tag as possible.

				
					<script type="text/javascript">
// Parse the URL
function getParameterByName(name) {
name = name.replace(/[\[]/, "\\[").replace(/[\]]/, "\\]"); var regex = new RegExp("[\\?&]" + name + "=([^&#]*)"),
results = regex.exec(location.search);
return results === null ? "" : decodeURIComponent(results[1].replace(/\+/g, " "));
}
// Give the URL parameters variable names
var source = getParameterByName('utm_source');
var medium = getParameterByName('utm_medium'); var campaign = getParameterByName('utm_campaign'); var term = getParameterByName('utm_term');
var content = getParameterByName('utm_content');
// Put the variable names into the hidden fields in the form.
// Find the appropriate hidden field via the input ID document.getElementById("form-utms-content").value = content; document.getElementById("form-utms-source").value = source; document.getElementById("form-utms-medium").value = medium; document.getElementById("form-utms-term").value = term; document.getElementById("form-utms-campaign").value = campaign;
</script>

				
			

Once you’ve implemented the JavaScript snippet on your website, create a new hyperlink to your web page containing UTM parameters (Campaign URL Builder) and test the form to ensure data is mapping appropriately. As leads from your advertising campaigns start to convert, you will be able to follow (and attribute) the lead’s progression through the Sales funnel. Optimize ad performance based on real-time Sales insights and plan with trends surfaced offer time. 

At Revely, we believe that quality data combined with an intentional strategy is key to creating experiences that build trust with your customers, while simultaneously driving revenue. Reach out to us at hello@revelyconsulting.com and let’s discuss how Revely can help your business.