Workshop: Profitipps für den JWPlayer
JWPlayer kann weit mehr, als nur Flash-Videos abspielen. HD-Video, Playlists, Skins, Wordpress-Integration und vieles mehr - wir zeigen, wie das geht.

- Workshop: Profitipps für den JWPlayer
- Teil 2: Workshop: Profitipps für den JWPlayer
Wer auf seiner Website Flash-Videos zeigen will, der verwendet dafür am besten JWPlayer (). Das Programm ist für den nicht-kommerziellen Gebrauch kostenlos und beeindruckt mit einem großen Funktionsumfang, der sich durch Plugins noch erweitern lässt.Das Viral-Plugin zeigt Zuschauern Links und...
Wer auf seiner Website Flash-Videos zeigen will, der verwendet dafür am besten JWPlayer (). Das Programm ist für den nicht-kommerziellen Gebrauch kostenlos und beeindruckt mit einem großen Funktionsumfang, der sich durch Plugins noch erweitern lässt.Das Viral-Plugin zeigt Zuschauern Links und Code, mit denen sie das Video weiterempfehlen und in eine eigene Seite einbetten können.
Playlists
Lange Videos sollten Sie in mehrere Clips zerschneiden. Dann erzeugen Sie eine Playlist für JWPlayer, mit deren Hilfe der Besucher die einzelnen Kapitel bequem anspringen kann. Das hat auch den Vorteil, dass Sie durch aussagekräftige Kapitel- namen und kurze Beschreibungen, die in der Playlist angezeigt werden, das Interesse Ihrer Zuschauer wachhalten können. JWPlayer erwartet Playlists im XML-basierten XSPF-Format (), das von PHP (via PEAR :: PACKAGE :: File_XSPF oder XSPF4PHP) sowie von Javascript und diversen anderen Sprachen unterstützt wird. Für Testzwecke reicht aber schon ein Texteditor aus.
Ein Beispiel für eine valide XSPF-Playlist finden Sie unter . Beachten Sie bei Ihren Experimenten, dass die Adresse der Video-Datei relativ zum JWPlayer, nicht zur Playlist angegeben wird. Praktischerweise sollte die Playlist auf demselben Server liegen wie der Player, sonst funkt das Sicherheitsmodell des Flash-Players dazwischen.
Im Player-Code geben Sie einfach statt der FLV-Datei die Playlist-Datei an. Über den Parameter playlist teilen Sie dem Player mit, ob die Liste rechts (right), über (over) oder unter (bottom) dem Video erscheinen soll. Wenn Sie den Player per SWFObject einbetten, dann übergeben Sie den Parameter so:
so.addVariable('playlist', 'right');
Sofern Sie per <embed> einbetten, müssen Sie flashvars um die genannte Variable ergänzen. Auf die gleiche Weise steuern Sie auch - je nach Ausrichtung - die Höhe beziehungsweise Breite der Playlist:
so.addVariable('playlistsize', '300');
Wichtig ist, dass Sie die Höhe/Breite zu der des Videos hinzuaddieren, wenn Sie die Größe des um die Playlist ergänzten SWFObject berechnen. Ist das Video 360 Pixel breit und die Playlist rechts angeordnet, müssen Sie das SWFObject mit einer Breite von 660 Pixeln definieren.
HD-Version ausliefern
Große Websites wie Youtube liefern Videos im Streaming-Verfahren aus. Unter anderem können Server und Client dabei die Videoqualität dynamisch an die verfügbare Bandbreite anpassen und per Bandwidth-Throtteling dafür sorgen, dass nur so viele Daten ausgeliefert werden, wie der Besucher ansieht.
JWPlayer spielt mit verschiedenen Streaming-Servern zusammen und lässt sich auch über Skripte wie xmoov-php versorgen. Das nicht ganz triviale Setup sowie Möglichkeiten, den Player mit eigenen Skripten anzusteuern, beschreibt die Seite unter .
Wer es weniger kompliziert mag, der integriert mithilfe des Plugins HD eine gleichnamige Schaltfläche in den Player, über die der Besucher zwischen zwei verschiedenen Versionen desselben Videos wechseln kann. Im Zusammenspiel mit der aktuellen Version 4.4 von JWPlayer ermittelt das HD-Plugin die verfügbare Bandbreite und startet automatisch die dazu passende Version des Videos.

Das Plugin finden Sie unter AddOns auf der Longtailvideo-Website. Anders als der GetThis-Knopf vermuten lässt, wird das Plugin aber nicht auf Ihren Rechner heruntergeladen. Stattdessen lädt JWPlayer es live vom Server des Anbieters.
Dazu müssen Sie den Wert für flashvars um einige Parameter ergänzen. Mit &plugins=hd-1 aktivieren Sie das Plugin. Per &hd.file=video-hd.flv übergeben Sie den Namen der HD-Version des Videos. Der vollständige Wert lautet dann beispielsweise
so.addParam("flashvars","file=video-sd.
flv&image=preview.jpg&plugins=hd-1&hd.file=video-hd.flv");
zm_timkaufmann