...
Auf dieser Seite erfahren Sie, wie Sie schnell und unkompliziert eigene audiovisuelle Inhalte auf einer Wikiseite - insbesondere Videos, die auf dem Medienserver der Freien Universität vorliegen - einbetten können.
Einer für alle
Das Center für Digitale Systeme (CeDiS) hat auf Basis von JavaScript und HTML5 einen neuen, FU-eigenen Video Player entwickelt, der die Einbindung von digitalen AV-Inhalten in den zentralen Publikationssystemen der Freien Universität ermöglicht.
Das Dieses neue Makro "Video Player" löst ab sofort den alten "HTML5 Player" ab.
Digitale Video- und Audioinhalte können somit auf verschiedensten Endgeräten optimal (responsiv) wiedergegeben werden.
Das neue Makro ermöglicht das einfache Anlegen von Wiedergabelisten sowie die automatische Einbindung von unterschiedlichen Video-/Audioqualitäten, Untertiteln und Startbildern.
Ab sofort ist der zentral gehostete Video Player in den folgenden webbasierten Publikationssystemen mit einheitlichen Funktionen verfügbar: Lernplattform Blackboard, Content Management System, Open Distributed Campus sowie Wikis und Blogs.
Beispiele Implementierung
| Video Player |
|---|
|
| Video Player Element (Video Player Sub-Element) |
|---|
| file | https://medien.cedis.fu-berlin.de/html5/sets/set6_mp4_playlist_quality_ut_poster/profund_innovation_720p.mp4 |
|---|
| qualities | ["720p","720p"],["144p","144p"],["240p","240p"],["360p","360p"],["480p","480p"],["1080p","1080p"] |
|---|
| title | Beispiel Video |
|---|
| poster | https://medien.cedis.fu-berlin.de/html5/sets/set6_mp4_playlist_quality_ut_poster/profund_innovation_poster.jpg |
|---|
| desc | Dies ist ein Beispielvideo mit unterschiedlichen Qualitäten, einem deutschen Untertitel sowie einem Startbild. |
|---|
|
| Untertitel / Kapitel / Beschreibungs - Element (Video Player Sub-Element) |
|---|
| langcode | de |
|---|
| src | https://medien.cedis.fu-berlin.de/html5/sets/set6_mp4_playlist_quality_ut_poster/profund_innovation_720p.mp4 |
|---|
| vtt | https://medien.cedis.fu-berlin.de/html5/sets/set6_mp4_playlist_quality_ut_poster/profund_innovation_DE.vtt |
|---|
|
|
| Video Player Element (Video Player Sub-Element) |
|---|
| file | https://medien.cedis.fu-berlin.de/html5/sets/set6_mp4_playlist_quality_ut_poster/2016-Campus-Management_192k.mp3 |
|---|
| qualities | ["192k","192k"],["128k","128k"],["160k","160k"],["256k","256k"],["320k","320k"] |
|---|
| title | Beispiel Audio |
|---|
| type | audio |
|---|
| poster | https://medien.cedis.fu-berlin.de/html5/sets/poster/fub_16_9_720_check/mein-audio_poster.jpg |
|---|
| desc | Dies ist ein Beispielaudio mit verschiedenen Qualitäten, einem deutschen Untertitel sowie einem Startbild. |
|---|
|
| Untertitel / Kapitel / Beschreibungs - Element (Video Player Sub-Element) |
|---|
| langcode | de |
|---|
| src | https://medien.cedis.fu-berlin.de/html5/sets/set6_mp4_playlist_quality_ut_poster/2016-Campus-Management_192k.mp3 |
|---|
| vtt | https://medien.cedis.fu-berlin.de/html5/sets/set6_mp4_playlist_quality_ut_poster/2016-Campus-Management_DE.vtt |
|---|
|
|
|
...
- Klicken Sie in das "Video Player Element" und wählen Sie "Neuer Untertitel" aus.
- Klicken Sie auf das eingefügte "Untertitel Element" und wählen Sie "Bearbeiten".
- Wählen Sie die verfügbare Sprache Ihrer Untertitel aus. Wenn Sie die korrekte Benennung der Untertiteldatei auf dem Medienserver beachten, werden die Untertiteldateien (WebVTT-Format) automatisch in das Feld eingefügt (s. u.).
- Speichern Sie die Einstellung und aktualisieren Sie Ihre Wikiseite.
- Beispiel-URL des Untertitels: https://medien.cedis.fu-berlin.de/html5/check/mein-video_DEde.vtt
| Tipp |
|---|
- Wir empfehlen, dass Sie Ihre Mediendatei entsprechend der Dateinamenskonvention auf dem Server speichern, z. B. mit dem Dateinamen "../mein-video_720p.mp4".
- In diesem Fall wird automatisch überprüft, ob die Mediendatei abrufbar ist.
- Außerdem wird geprüft, ob weitere Dateien auf dem Server existieren (z. B. andere Qualitäten, ein Startbild oder Untertitel).
|
...
