Tracking von YouTube Videos mit Google Analytics – Teil 2

Wie bereits im Teil 1 geschildert, können YouTube Videos hervorragend mit Google Analytics getracked werden und dient zur Auswertung des Nutzerinteresses an den dargebotenen Videos Ihrer Webseiten. Wozu dann noch dieser zweite Post? Nun, unlängst ist mir eine unschöne „Nebenwirkung“ aufgefallen, die im Zusammenhang mit Apple’s Safari Browser auf iPhone, iPod Touch und dem iPad entsteht.

Denn solange auf Ihrem System (Windows, Linux, Mac OS, etc.) ein installierter Flashplayer seinen Dienst verrichtet, stellt die Wiedergabe eines Videos kein Problem dar. Aber gerade die Nutzer mit mobilen Endgeräten (iPhone & Co.), die auf Ihre Website zugreifen, erleben beim Aufruf der entsprechenden Seite eine böse Überraschung: Das YouTube Video kann nicht abgespielt werden; es wird noch nicht einmal angezeigt! Leider kein angenehmer Zustand, sondern viel eher  eine „bad user experience“.

Tracking von YouTube Videos schlägt bei Nutzung von iPhone, iPod Touch und iPad fehl.

Und es funktioniert doch…

Nachdem ich mich mit dem Problem etwas näher beschäftigt habe, ist mir die nachstehende Lösung eingefallen: Hier wird in einer (zugegebenermaßen etwas aufwändigen) Routine geprüft, ob ein Flashplayer installiert ist. Wenn nicht, wird ein entsprechendes Bild eingefügt und bei Klick darauf eine Umleitung zu YouTube eingerichtet.

Um das zu bewerkstelligen, muss lediglich der unten aufgeführte Quellcodes in unseren YouTube Tracker integriert werden: kopieren Sie einfach den Quellcode zwischen den beiden <!– snip no flash –> Tags in den Abschnitt „Player“ Ihres vorhandenen YouTube Trackers. Sie haben doch schon unseren YouTube Tracker? Nicht? Dann einfach Kommentar mit E-Mail-Adresse hinterlassen, dann schicke ich Ihnen den kostenfreien Code zu…

Allerdigns sind im Quellcode dieser BETA-Version sind noch ein paar Anpassungen nötig:

1. Die YouTube Video ID muss eingefügt werden.

Diese muss mit der des im YouTube Tracker eingegebenen identisch sein.

document.write(‚<A HREF=“http://www.youtube.com/watch?v=LvutIWu4dvU&hl/„><img src=“pic1.JPG“ title=“Sie haben kein Flash installiert. Sie werden zu YouTube weitergeleitet.“ ></A>‘);

2. Ein Bild muss angegeben werden.

Ein Bild, das anstelle des YouTube Videos angezeigt werden soll, muss angegeben werden und natürlich auch vorhanden sein. Idealerweise ist dieses mit Ausschnitt des anzuzeigenden Videos identisch.

document.write(‚<A HREF=“http://www.youtube.com/watch?v=LvutIWu4dvU&hl/“><img src=“pic1.JPG“ title=“Sie haben kein Flash installiert. Sie werden zu YouTube weitergeleitet.“ ></A>‘);

Ein mit dem Initialbild des Videos übereinstimmendes Bitmap sollte unbedingt vorhanden sein

3. Sie haben die Möglichkeit, einen Tool Tip Text einzufügen.

Erläutern Sie, was warum passiert. Nutzen Sie die Tool Tip Text Funktion, um den Betrachter zu informieren.

document.write(‚<A HREF=“http://www.youtube.com/watch?v=LvutIWu4dvU&hl/“><img src=“pic1.JPG“ title=“Sie haben kein Flash installiert. Sie werden zu YouTube weitergeleitet.“ ></A>‘);

Das Ergebnis kann sich sehen lassen…

Hier das Ergebnis. Die Weiterleitungen werden in Google Analytics in den Berichten des Ereignistracking angezeigt. Hier im zweiten Unterpunkt.

Nach der Modifikation des YouTube Trackers werden auch Events von iPhone & Co. erfasst

Die Modifikation des Quellcodes…

Hier nun die Modifikation im Überblick:

<!---------------------------------------------------------------------- snip Player1 ----------------------------------------------------------->
<table align="center">

<tr>

<td><div id="videoDiv">

<!---------------------------------------------------------------------- snip no flash ---------------------------------------------------------->

<script language="javascript">

var flashinstalled = 0;

var flashversion = 0;

MSDetect = "false";

if (navigator.plugins && navigator.plugins.length) {

x = navigator.plugins["Shockwave Flash"];

if (x) {

flashinstalled = 2;

if (x.description) {

y = x.description;

flashversion = y.charAt(y.indexOf('.')-1);

}

}

else

flashinstalled = 1;

if (navigator.plugins["Shockwave Flash 2.0"]){

flashinstalled = 2;

flashversion = 2;

}

}

else if (navigator.mimeTypes && navigator.mimeTypes.length)       {

x = navigator.mimeTypes['application/x-shockwave-flash'];

if (x && x.enabledPlugin)

flashinstalled = 2;

else

flashinstalled = 1;

}

else

MSDetect = "true";

</script>

<script language="vbscript">

on error resume next

If MSDetect = "true" Then

For i = 2 to 6

If Not(IsObject(CreateObject("ShockwaveFlash.ShockwaveFlash." & i))) Then

Else

flashinstalled = 2

flashversion = i

End If

Next

If flashinstalled = 0 Then

flashinstalled = 1

End If

End If

</script>

<script language="javascript">

if (flashinstalled == 2) {

if (flashversion)

//document.write("You have Flash version " + flashversion + " installed.");

else

document.write("You have Flash installed, but I can't detect the version.");

}

else if (flashinstalled == 1) {

ytpEventTracker._trackEvent("No Flash, load source from YouTube - " + kategory + " - " + videoName,videoName);

document.write('<A HREF="http://www.youtube.com/watch?v=LvutIWu4dvU&hl/"><img src="pic1.JPG" title="Sie haben kein Flash installiert. Sie werden zu YouTube weitergeleitet." ></A>');

}

else document.write("I can't find out if you have Flash installed.");

</script> -->

<!---------------------------------------------------------------------- snip no flash ---------------------------------------------------------->

</div></td>

</tr>

</table>

<!---------------------------------------------------------------------- snip Player1 ----------------------------------------------------------->

7 Kommentare zu „Tracking von YouTube Videos mit Google Analytics – Teil 2“

  • Hi, ich finde eure Arbeit Klasse!!! Genau nach dem hab ich schon länger gesucht! Wäre es möglich den gesamten Quellcode zu bekommen? Am liebsten mit einer kleinen Demo-Seite, da ich nicht gerade der Herr von JavaScript & Co bin 😉

    Cheers
    Alexander (kontakt [at] alexanderholzer.com

  • Hey,

    wirklich sehr interessanter Artikel!

    Ich bräuchte auch den Code um zu tracken, wie oft ein Yiutube video, das auf unserer Seite eingebunden ist, abgesoielt wird und natürlich das, was notwendig ist, um die Videos auch auf mobilen Endgeräten darzustellen.

    Vielen Dank und Grüß!

  • Vinzent:

    Großartiger blog. Könntest du mir bitte den Youtube Tracker zuschicken? Besten Dank und viele Grüße!
    Vinzent

  • Ulrike:

    Hallo,
    toller Artikel – genau eine solche Lösung zur Analyse meiner Youtube-Videos innerhalb von Analytics habe ich gesucht. Könntest Du mir den YouTube Tracker zuschicken? Besten Dank und viele Grüße

  • Rene:

    Hallo Robert,

    danke für diesen Beitrag! Genau mit diesem Problem habe ich nun auch zu tun…
    Bitte sende mir doch den nötigen Code incl. YouTube Tracker

    Super!
    Vielen Dank
    René

  • Ronny:

    Hallo,

    ein wirklich toller Beitrag. Nach solch einer Lösung suche ich bereits die ganze Zeit. Könntet Ihr mir den gesamten Quellcode + den YouTube Tracker zukommen lassen? Das wäre super.

    Vielen Dank und viele Grüße
    Ronny

  • Code kommt per E-Mail… 🙂

Kommentieren

Follow us:
Abonnieren Sie unseren Blog!
Folgen Sie uns auf Twitter!
Folgen Sie uns auf Facebook!
Folgen Sie uns auf LinkedIn!
Feedburner-Abo
RSS Feed für Reader abonnieren

oder geben Sie Ihre E-Mail-Adresse an:

Kategorien
Archive