Tracking Javascript Events

Support & Bugs
1

Disclaimer - what I know about web development could fit on a postage stamp.

Firstly, just switched from Analytics to Piwik and am thrilled that I did. A first rate product.

One of my sites has a Javascript slider on the front page (www.homedocumentmanager.com). I’m unconvinced that users are even seeing what’s on the slider’s other pages. Can anyone tell me how to track the Javascript events with Piwik?

The slider buttons are defined like:

How would I track this?

Many thanks,

Tim Haughton

2

Check out: “Force a click on a link to be recorded as a download in Piwik” in the Javascript Tracking documentation. It introduces the idea of using a “class” to track links.

3

Hi Robert, thanks for your reply. I added the class=‘piwik_download’ to the links for both buttons:

This fails to track a download. Is it because the only target is javascript?

Thanks,

Tim

4

Yes.

Create a wrapper function to call stepBy and trackLink, and call this function instead. (The class=“download” attribute can be dropped since you’re calling the JavaScript tracking API directly.)

5

That’s great, thanks for the reply!

Can I refer you to the disclaimer at the top of my first post style_emoticons/<#EMO_DIR#>/wink.gif What might this look like, I’m afraid I don’t speak JavaScript. Seems like I won’t be able to put off learning it much longer though.

p.s. Not sure what beer costs over there, hopefully I’ve bought you at least 1. Cheers

6

Thanks.

I’m going to make an educated guess here that you don’t really care when the user scrolls through the thumbnail gallery, and instead, are more interested when he/she clicks on a thumbnail to open a full-size image in a window.

So, let’s leave your HTML as it was without the class=“download”.

We can simply add the call to trackLink() in your (presumably) existing onpanelclick handler, e.g.,

<script type="text/javascript">
stepcarousel.setup({
  /* ... existing gallery setup options here ... */
  onpanelclick: function(target) {
	if (target.tagName=="IMG" && target.parentNode.tagName=="A") {

	  piwikTracker.trackLink(target.parentNode.href, 'download');

	  window.open(target.parentNode.href, "", "width= 800px, height=700px, scrollbars=1, left=100px, top=50px");
	  return false //cancel default action (load link in current window)
	}
  }
});
</script>