Tracking from within a Javascript function


(Burkhard) #1

Hi
I am running an intranet website with heavy use of JS to centralise things. I was using a tracking service that was based on a pixel (the name of which was the page title to track) but I have to move to a new solution and chose Piwik. Until now, I had the tracking code in a javascript function that
(a) could tell at runtime if it was running in a test scenario or from the production server
(b) loaded the pixel with a different name depending on (a)

Now I would like to do the same with Piwik: Every webpage to track would include a statement like

<script language="Javascript">usepiwik("name_of_page");</script>

and everything else would happen in the js function “usepiwik()” that sits in a js file already loaded. However, I seem to be unable to get that working. My latest attempt was based on code from this forum (see here). Here is the simple version of the function:

// This is the function called by webpages to be tracked. 
function usepiwik(pagetitle)
{
document.write("Function usepiwik");
var script = document.createElement("script");
script.setAttribute("language","JavaScript");
script.setAttribute("src","(ext link)xx.xx.88.114:2010/piwik/piwik.js");
document.body.appendChild(script);
var piwikTracker = Piwik.getTracker("(ext link)xx.xx.88.114:2010/piwik/piwik.php", 2);
piwikTracker.setDocumentTitle(pagetitle);
piwikTracker.trackPageView();
}

The document.write() text shows on the screen so the function is actually being called but the Firefox JS console keeps on telling me “Piwik is not defined”, pointing to the Piwik.getTracker() call.

What’s wrong?


(Matthieu Aubry) #2

You would need to use the existing JS tracking API and use setDocumentTitle(), etc. see the doc at http://piwik.org/docs/javascript-tracking/


(Burkhard) #3

Hi Matthieu
Thanks for doing this support work, by the way. Not a matter of course everywhere.

In my code sample, there actually is a “piwikTracker.setDocumentTitle()” call. It won’t work because the original “var piwikTracker = Piwik.getTracker()” fails (“Piwik is not recognised”). I had hoped that somebody other than myself would look at the code and just see the problem :slight_smile: I only know that my URLs are correct.

Thanks again.
Burkhard


(Matthieu Aubry) #4

You just need to include the piwik.js script before calling Piwik.getTracker, ie.

<script type="text/javascript">
var pkBaseURL = (("https:" == document.location.protocol) ? "https://YOURURL/" : "http://YOURURL/");
document.write(unescape("%3Cscript src='" + pkBaseURL + "piwik.js' type='text/javascript'%3E%3C/script%3E"));
</script>

(Burkhard) #5

Hi Matthieu
Thanks for your effort but that doesn’t help. You haven’t read my question. Your last reply refers to using the tag code in an HTML page but that was not the question.
Thanks anyway


(vipsoft) #6

Burkhard: your code fails because loading piwik.js in that manner is non-blocking. When you add the script node to the DOM, JavaScript execution doesn’t wait for it to load, and hence, Piwik is not defined.

You’re better off always loading piwik.js, and then using a conditional on whether or not to track the page view, enable link tracking, etc.


(Burkhard) #7

Hi vipsoft,
I did not know that (the “non-blocking” part), so I was encouraged to try loading piwik.js in the HTML head (had tried that before but it failed … even including the code of piwik.js into myown.js did not help).

Here’s what I do. Between the tags I write:

<script language="JavaScript" type="text/JavaScript" src="http://xx.xx.xx.114:2010/piwik/piwik.js"></script>
<script language="JavaScript" type="text/JavaScript" src="scripts/myown.js"></script>

piwik.js is fetched from the tracking server, everything else comes from my intranet website.

At the bottom of my HTML page, just before I go:

<script language="Javascript">usepiwik("Greeting Page");</script>

Of course, in the future that is supposed to be a more sophisticated page name but as yet, I am just testing.

Now, in myown.js I have this:

function usepiwik(pagename)
{
document.write("Function usepiwik");
var piwikTracker = Piwik.getTracker("(ext link)xx.xx.xx.114:2010/piwik/piwik.php", 2); 
piwikTracker.setDocumentTitle(pagename);
piwikTracker.trackPageView();
}

The “document.write” shows on the screen, the JS console in Forefox does not record any errors, but alas, piwik records no page impression (however, using the original tag right in the HTML works). I hope this time it’s an easy error…
Thanks again!
Burkhard


(Burkhard) #8

I solved it myself. The “” syntax is crap. When I replaced that with “http://” it worked immediately, after a lot of trial and error. My knowledge of Javascript is not too good so I had no way of knowing while that must have been obvious for everybody else…