So holen Sie das letzte aus dem JWPlayer raus

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.

  1. Workshop: Profitipps für den JWPlayer
  2. Teil 2: Workshop: Profitipps für den JWPlayer
Workshop: Video-Player

© Archiv

Workshop: Video-Player

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.

Workshop: Video-Player

© Archiv

Nutzen Sie Playlists, um auf verschiedene Facetten eines Produktes hinzuweisen oder ein langes Video zu unterteilen.

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

Mehr zum Thema

Youtube Sperre umgehen GEMA
Videos freischalten

So umgehen Sie die GEMA-Sperre bei Youtube. Was Sie dazu brauchen, und wie es am einfachsten geht.
Neue Fritzboxen unterstützen den AC-Standard.
WLAN-Geschwindigkeit verdoppeln

Mehr WLAN-Geschwindigkeit: Mit dem WLAN-Standard 802.11ac und den richtigen Geräten und Einstellungen verdoppeln Sie den Datendurchsatz.
Netflix auf dem TV
Programm in der Übersicht

Welche Filme und Serien gibt es bei Netflix eigentlich zu sehen? Was ist neu im Streaming-Angebot? Diese Antworten helfen weiter.
Netflix
Streaming

Preise, kompatible Geräte, Datenrate, Serien- und Filmangebot von Netflix: Wir beantworten die wichtigsten Fragen rund um den Streaming-Dienst.
E.T. – Der Außerirdische
Vorschau auf Film- und Serien-Highlights

Amazon Prime Instant Video lockt im Dezember 2016 mit Film-Highlights wie "E.T.", "Fast & Furious 7" und der Serie "Ku’damm 56​".