Implementing passing pk_ parameters into third-party tools using Piwik PRO Tag Manager

Published: June 8, 2016 Updated: August 24, 2018 Author Category Tag Manager, Use cases

Explanation

Piwik PRO pk_ tags for tracking campaign data are a very important part of Piwik PRO reports. Thanks to them we are able to attribute the source of our traffic very accurately – that is, if our tagging scheme is well thought out.
NOTE: Use our helpful Piwik PRO URL Builder to ensure that all sensible parameters are added to your links

Using these tags in Piwik is quite easy, because we just need to tag our URL and Piwik does the rest.

Example of the tagged URL:

https://piwik.pro/?pk_campaign=Google_Campaign&pk_medium=cpc&pk_source=google

However, using those parameters in other third-party tools can be difficult. We have to extract the data from tagged URL some other way. And of course, we have to store them to use in other tools. The best way to do this is to use cookies.

Is it possible to drop those tags values into Marketo – the most popular marketing automation software?

Yes, of course! We can use the Marketo option which gives us the ability to extract URLs directly from the url. But what if we want to use the original source of the Lead Attribution and do not want to overwrite it after that?

Our cookie-based solution can be used on other third-party tools as well. Let’s prepare the configuration and get those values.

Free Comparison of 6 Enterprise-Ready Tag Management Systems

Get to know the 40 key differences between Google Tag Manager, Tealium, Segment, Adobe Marketing Cloud, Ensighten & Piwik PRO:

Download FREE Ebook

Piwik PRO Tag Manager configuration

Piwik PRO Tag Manager will help use to easily implement dedicated code which will extract the values of the pk_ parameters and write them into cookies. (and you can learn more about Tag Manger from our series of User Guides)

Firstly, we have to create a new tag by clicking on +Add a tag button:

Piwik PRO Tag Manager - adding a tag
Piwik PRO Tag Manager - adding a tag

Then we set up the Tag name (1) and under the Asynchronous tab we choose an Asynchronous custom HTML tag (2):

Configuring new tag in Piwik PRO Tag Manager
Configuring new tag in Piwik PRO Tag Manager

Now it’s time to introduce our special code. Thanks to this, we will be able to recognize following parameters, extract their values and set new cookies (but only if there are no cookies assigned to this user yet):

  • pk_campaign
  • pk_source
  • pk_medium
  • gclid

This last one is the gclid parameter. This parameter is used by Google AdWords and it’s always added to the URL when someone goes to our website through an ad in Google search results.

Here is the code:

<script type="text/javascript">
(function () {
	var getParameterByName = function (name) {
		name = name.replace(/[\[]/, "\\[").replace(/[\]]/, "\\]");
		var regex = new RegExp("[\\?&]" + name + "=([^&#]*)"),
			results = regex.exec(location.search);
		return results === null ? "" : decodeURIComponent(results[1].replace(/\+/g, " "));
	}

	var setCookie = function (name, value, expires, path) {
	    var expiresAttr = '';
	    path = path === undefined ? '/' : path;

	    if (expires) {
	        var date = new Date();
	        date.setTime(date.getTime() + (expires * 1000));
	        expiresAttr = '; expires=' + date.toGMTString();
	    }

	    document.cookie = name + '=' + value + expiresAttr + '; path=' + path;
	};

	var getCookie = function (name) {
	    var cookies = document.cookie ? document.cookie.split('; ') : [],
	        i = 0;

	    for (; i < cookies.length; i++) {
	        var parts = cookies[i].split('=');
	        var cookieName = parts[0].replace(/^\s+|\s+$/gm, '');
	
	        if (cookieName === name) {
	            var value = parts.slice(1).join('=');

	            if (value.charAt(0) === '"') {
	                value = value.slice(1, -1);
	            }
	            return value;
	        }
	    }
	    return undefined;
	};

	var PK_SOURCE = 'pk_source';
	var PK_MEDIUM = 'pk_medium';
	var PK_CAMPAIGN = 'pk_campaign';
	var GCLID = 'gclid';

	var source = getParameterByName(PK_SOURCE);
	var medium = getParameterByName(PK_MEDIUM);
	var campaign = getParameterByName(PK_CAMPAIGN);
	var adwords = getParameterByName(GCLID);

	if(!getCookie(PK_SOURCE) || getCookie(PK_SOURCE) === "") {
		setCookie(PK_SOURCE, source);
	}
	if(!getCookie(PK_MEDIUM) || getCookie(PK_MEDIUM) === "") {
		setCookie(PK_MEDIUM, medium);
	}
	if(!getCookie(PK_CAMPAIGN) || getCookie(PK_CAMPAIGN) === "") {
		setCookie(PK_CAMPAIGN, campaign);
	}
	if(!getCookie(GCLID) || getCookie(GCLID) === "") {
		setCookie(GCLID, adwords);
	}
})();
</script>

Now that we have this code, we can return to our tag configuration and simply paste it into Tag HTML field:

Inserting the code
Inserting the code

After that, we only have to configure the tag’s trigger by deciding which which URL’s our script will be fired on. To correctly use this feature to collect data and store it in cookies, we should fire this tag on every page of our website.

So, the configuration of the trigger will look like this:

Creating trigger for all pages
Creating trigger for all pages

After this, we need to save the Trigger and the whole tag.

We can publish our changes with this new tag by clicking Publish.

Publishing last changes
Publishing last changes

It is crucial at this point to test our website manually by clicking a couple of random pages and check to see if everything is fine. It is possible that different websites will generate problems when working with additional scripts.

Tracking review

Now, this is the fun part – testing our script and making sure that the right values are transferred.

We will use Google Chrome to do this.

Go to the tagged url of your page – we will use the example from the beginning:

https://piwik.pro/?pk_campaign=Google_Campaign&pk_medium=cpc&pk_source=google

and hit F12 on your keyboard. This triggers the Developers Tools and allows you to check the saved cookies.

We then go to the Resources tab, and then the Cookie item on the left and by expanding chosen URL of our website (in our case piwik.pro) we find our 3 parameters with values from the URL:

Checking saved cookies
Checking saved cookies

Marketo configuration

Okay, so we can store this valuable data in cookies.

Now, let’s use them in Marketo. We will need them to work with a user’s form submission so we need to add some special hidden fields in every Marketo form where we we want to collect data from tagged URLs.

The illustration below shows us the final configuration of a simple Contact Form:

Hidden fields in Marketo form
Hidden fields in Marketo form

Notice that, apart from the regular form fields, there are now four additional fields above. These fields collect the values from our previously defined parameters.

Looking inside one of the fields and we see that collecting is cookie-based:

Additional field configuration
Additional field configuration

The most important part is that these fields are hidden and their function is ONLY to collect values from specific URL parameters and convert them into Marketo fields.

Hidden field option
Hidden field option

Here we it’s important to add that these fields (apart from Lead Source) have to be manually configured. Notice that if there is no value to send (e.g. if the URL has no campaign parameters) not specified value is put into this field.

Now you are able to enhance your configuration of Marketo – and you have the basic info which is the foundation of the Lead Source recognition.

Free Comparison of 6 Enterprise-Ready Tag Management Systems

Get to know the 40 key differences between Google Tag Manager, Tealium, Segment, Adobe Marketing Cloud, Ensighten & Piwik PRO:

Download FREE Ebook

Tagged under

Author:

Szymon Grzesiak, Marketing Tech Lead

Tech savvy Performance Marketing Specialist. LinkedIn Profile

See more posts of this author
Free Comparison of 5 Enterprise-Ready Tag Management Systems

Share