Category: Technology, Web & Cloud

Nicht nur in Flowplayer lässt sich Piwik integrieren, mit HTML5 geht das auch:

<!– Piwik –>
<script type=”text/javascript”>
var pkBaseURL = ((“https:” == document.location.protocol) ? “https://andreas.neumeier.org/piwik/” : “http://andreas.neumeier.org/piwik/”);
document.write(unescape(“%3Cscript src=’” + pkBaseURL + “piwik.js’ type=’text/javascript’%3E%3C/script%3E”));
</script>
<script type=”text/javascript”>

function trackVideo(goal) {
try {
var piwik = Piwik.getTracker(pkBaseURL + “piwik.php”, 1);
console.log(“got piwik”);
piwik.trackGoal(goal);
console.log(“piwik logged goal and videoName”);
}
catch( err ) {
console.log(“Error: ” + err);
}
}
</script>
<!– End Piwik Tracking Code –>
<video src=’http://andreas.neumeier.org/wordpress/wp-content/uploads/2011/06/BigBuckBunny_320x180.ogg’
controls=”controls”
onPlay=’trackVideo(2);’
onEnded=’trackVideo(3);’>
BigBuckBunny_320x180
</video>

Ausprobieren hier: Piwik Tracked Video

Das <video>-Tag unterstützt einige Events, die sich hervorragend tracken lassen, so beispielsweise wenn ein Video abgespielt wird mittels <video src=’url’ onPlay=function() {piwik.TrackGoal(2);}>. Piwik muss das zugehörige Goal natürlich kennen.