Implementing Custom Page Names in Piwik reporting via Piwik PRO Tag Manager

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

Why Custom Page Names?

By default, in its Page titles report, Piwik uses the content of the <title> tag of the specific URL. But if the page titles are optimized for SEO or for some internal pages even missing report become unclear.

Piwik gives its users the opportunity to set custom page titles which are only visible in Piwik reporting. So for any URL we select, we can set a clear and meaningful custom page title.

Use Case scenario

For the purposes of this use case, we have decided to change the page title of two pages on the piwik.pro website – Home Page and Contact Page. We want to shorten them as represented in the table below:

Page Original Custom
piwik.pro On-Premises, Self-hosted Web Analytics Software Home Page
piwik.pro/contact Contact with Piwik PRO On-Premises Contact Page

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

There is no need to set up anything in Piwik web platform. Everything will be configured on the backend – in this case in the Piwik PRO Tag Manager Tag Manager.

Without Piwik PRO Tag Manager we would have to bother our IT team and get them to edit the code – in this case the <head> section – of the particular URLs in question. Since most of the pages are configured with page templates, modifying the section changes things across all the pages. And because of this, it would be necessary to use some custom coding to extract specific pages. Happily, with Piwik PRO Tag Manager you can do this quite easily by yourself.

Piwik PRO Tag Manager Configuration

We can start by creating an additional tag for the implementation. After clicking + Add a tag on the main container page:

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

we will create two tags, pretty much identical, but we will talk about that later.

We have to choose a recognizable Tag name (1) and choose the Asynchronous custom HTML tag (2) option

New tag configuration
New tag configuration

In the next step we have to implement the special code which will send the new Custom Page title to Piwik. We paste the following code into the Tag HTML field:

<script>
_paq.push(['setDocumentTitle', "Home Page"]);
_paq.push(['trackPageView']);
</script>

Remember that, you can put in place of “Home Page” whatever you want. There is even the possibility to use some variables to automatize the whole process. For example:

<script>
_paq.push(['setDocumentTitle', document.domain + "/" + document.title]);
_paq.push(['trackPageView']);
</script>

Which will insert a combination of the domain name and page title into Page title report.

For the second tag the value will be “Contact Page”.

Custom Piwik code implementation
Custom Piwik code implementation

Now we have to configure the trigger – condition to determine when the tag fires. We have to set a Trigger Name (1), specify that trigger as Loads on Page view (2)(3) and Page Url is a https://piwik.pro/ (4)

Trigger configuration in Piwik PRO Tag Manager
Trigger configuration in Piwik PRO Tag Manager

The trigger configuration of the second tag (for our Contact page) will be different:

  • Trigger Name – Contact Page
  • Page Url – equals to https://piwik.pro/contact

Now Save the trigger configuration and again Save whole tag.

And finally, Publish the new changes:

Publishing last changes
Publishing last changes

Piwik reports review

To see how this looks in Piwik, we can look at the changes in Page titles report (one of the Actions Reports). We have to visit the home page and contact page to generate some new page views. Remember that if you have your IP excluded from the reports, you will have to use some VPN software to be able to see the page views which you generated.

Now we can see the new custom Page titles in our report:

Piwik Page titles report
Piwik Page titles report

Configuration Problem

We have found our visit in Visitor Log too and we notice that the new page titles are visible:

Visitor Log in Piwik
Visitor Log in Piwik

But, we should mention one point about this configuration which you should be aware of – two page views have been duplicated (with original title and custom one). We have only visited each page once. So why did this happen?

The main Piwik code has a
_paq.push(['trackPageView']);
snippet to track page views. Without it, Piwik will not show any data in the reports. But now with our new method which is changing the title in the report, we have executed this action again, so we have a duplication.

We can’t delete the first occurrence of the trackPageView because this would mean that all the other (besides new tag with custom title) data wouldn’t be tracked. We can’t add a new tag before the main one, because the main Piwik tag calls for others which are necessary to make the tool work correctly.

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