Beta website

Set a custom page title and URL in Piwik

Setting a custom title and tracking URL can be handy when you wish to modify the URL and Page title to hide private info, but want to see how many people are using your product. A good example would be tracking usage on an admin interface whilst giving your users some privacy.

Considering the above information, lets assume that our website user is visiting on http://example.com/private/area/one with a page title of Private Area of User Bob. Since we want to track this view but still give some privacy to Bob we should probably change the title. Lets change the URL to just http://example.com/private/area/ with a title of Private Area.

Given our normal Piwik tracking code looks like this:

<!-- Piwik -->
<script type="text/javascript">
  var _paq = _paq || [];
  _paq.push(['trackPageView']);
  _paq.push(['enableLinkTracking']);
  (function() {
    var u="//stats.example.com/";
    _paq.push(['setTrackerUrl', u+'piwik.php']);
    _paq.push(['setSiteId', 1]);
    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="//stats.example.com/piwik.php?idsite=1" style="border:0;" alt="" /></p></noscript>
<!-- End Piwik Code -->

To add our custom title and page URL we simply add two more lines (lines 4 and 5 below) into the code above the trackPageView line:

<!-- Piwik -->  
<script type="text/javascript">  
  var _paq = _paq || [];
  _paq.push(['setDocumentTitle', 'Private Area']);
  _paq.push(['setCustomUrl', 'http://example.com/private/area/']);
  _paq.push(['trackPageView']);
  _paq.push(['enableLinkTracking']);
  (function() {
    var u="//stats.example.com/";
    _paq.push(['setTrackerUrl', u+'piwik.php']);
    _paq.push(['setSiteId', 1]);
    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="//stats.example.com/piwik.php?idsite=1" style="border:0;" alt="" /></p></noscript>  
<!-- End Piwik Code -->

By simply adding two lines we’re manually changing the URL and Title!

And voilá! We are now tracking the page in Piwik with the changed URL and page title.