Using Piwik PRO Tag Manager to implement subdomain tracking in Piwik

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

Explanation

A very common occurrence in the world of analytics is that the main website, i.e. example.com, also has subdomains that we want track along with the main site. The most common example of this are the different language versions of the website.

Example

Let’s say that we are running a English-speaking company, but we are operating in several European markets. This means we have following websites:

  • example.com – main English version
  • de.example.com – German version
  • nl.example.com – Dutch version
  • pl.example.com – Polish version

and we want them to be tracked in one instance of Piwik so that we can collect the combined data of all the visitors.

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 configuration

To be sure that Piwik will correctly recognize and track these visits, we have to add them in the Administration panel of Piwik’s settings.

To do this, we have to go to the Administration panel (1), and under the Administration option in the main menu click Websites (2), then choose to Add New website or edit an existing one, set the Name of the website (3) and insert all the pages we want to track into URLs field (4) (For more information check the How to Add a Website User Guide):

Configuring new website in Piwik
Configuring new website in Piwik

Save new configuration.

Piwik PRO Tag Manager Configuration

After configuring our Piwik Administration panel, we now have to insert the appropriate JavaScript code into our website’s source code. Remember that this code snippet should be added on all the websites we want to track.

We are going to use the Piwik PRO Tag Manager tool to insert this Piwik code. This implementation should be repeated for all websites in question, so each website will end up having a Piwik PRO Tag Manager code snippet added.

There are two ways of doing this:

  1. Create one global container for all of the websites and use the same Piwik PRO Tag Manager container code.
  2. Create a separate container for each website and use a different container ID in the Piwik PRO Tag Manager code for each website – we recommend this option because this way you can implement other tags which would be unique to each individual website.

Let’s create a Piwik tag for the site example.com using the correct Piwik code whicch contains information about additional subdomains.

Note: The following steps should be carried out if the main Piwik code has not been implemented yet. If it has, just skip down to the specific changes within the code.

First, we have to create a new tag by clicking on the + Add a tag button (Learn more about tags from our Tag Manager User Guide):

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

On the second screen, we are set an unique, easily recognizable Tag name (1) and then we choose Asynchronous custom HTML tag (2). We won’t be able to use the Piwik template because we need to modify our code.

Configuring Piwik custom code
Configuring Piwik custom code

Now we have to paste in our modified Piwik code which will be able to track our main domain and subdomains.

Code for pasting:

<!-- Piwik -->
<script type="text/javascript">
var _paq = _paq || [];
//set the domain and subdomain to track
_paq.push(['setCookieDomain', '*.example.com']);
_paq.push(['setDomains', '*.example.com']);
_paq.push(['trackPageView']);
_paq.push(['enableLinkTracking']);
(function() {
var u="//piwik.example.com/";
_paq.push(['setTrackerUrl', u+'piwik.php']);
//set the right ID of your instance
_paq.push(['setSiteId', 2]);
var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
g.type='text/javascript'; g.async=true; g.defer=true; g.src=u+'piwik.js'; s.parentNode.insertBefore(g,s);
})();
</script>
<noscript><p><img src="//piwik.example.com/piwik.php?idsite=2" style="border:0;" alt="" /></p></noscript>
<!-- End Piwik Code -->

When implemented in the Piwik PRO Tag Manager interface, it should looks like this:

Custom Piwik code implementation
Custom Piwik code implementation

Now our custom Piwik tag should fire on every page. We want the tag to fire on every pageview, so we set a trigger as seen below:

Creating trigger for all pages of all websites
Creating trigger for all pages of all websites

Now Save all changes and Publish the tag.

Publishing last changes
Publishing last changes

Now our report will contain data based on visitors to both the main domain and all subdomains where this code has been inserted.

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