Sprungmarken

Servicenavigation

Hauptnavigation

Sie sind hier:

Hauptinhalt

Videos

Videos können mithilfe des HTML5-Video-Tags in Fiona-Inhaltsfelder eingebunden werden.

Voraussetzungen

Absoluter Pfad zum Video

Videos werden nicht in Fiona hochgeladen, sondern in der Regel in Ihren Webstar-Bereich. Mit dem absoluten Pfad ist nicht der Fiona-Pfad gemeint, sondern ein Pfad der Form http://www.ihrwebstarbereich.de/film.mp4.

Codierung des Videos

Das Video sollte mit dem H.264-Codec kodiert sein und in einem MP4-Container liegen, um auf allen relevanten Systemen abgespielt werden zu können. Die Tonspur sollte mit dem AAC- oder MP3-Codec kodiert sein.

Vorschaubild

Optional kann ein Vorschaubild definiert werden, das vor dem Abspielen anstelle des Videos angezeigt wird. Das Vorschaubild kann in Fiona oder in Ihren Webstar-Bereich hochgeladen werden.

Einfügen über den Tiny-Editor

  1. Cursor im Editor an gewünschte Stelle setzen
  2. In der Menüleiste den Button "Medien einfügen/bearbeiten" wählen
  3. Im Pop-Up im Feld "Quelle" die Video-URL eingeben (Absoluter Pfad)
  4. Unter dem Punkt "Abmessungen" kann die Darstellungsgröße gewählt werden, unter dem Punkt "Erweitert" - "Poster" kann die URL zum Vorschaubild eingetragen werden
  5. Mit "OK" bestätigen"

video_einfuegen_tiny

Manuelle Einbindung in einem Inhaltsfeld

Hierbei sind rudimentäre HTML-Kenntnisse erforderlich, da Quelltext in die Quelltextansicht eingefügt und angepasst werden muss.

Die Quelltext-Ansicht ist unter dem Punkt "Werkzeuge" aufrufbar. Folgender Quelltext kann nun an die gewünschte Position eingefügt werden:

<video width="640" height="360" controls="controls" poster="http://www.ihrwebstarbereich.de/vorschau.jpg">
<source src="http://www.ihrwebstarbereich.de/film.mp4" type="video/mp4" />
Ihr Browser unterstützt das Video-Tag nicht. Wenn Sie das Video dennoch ansehen möchten, finden Sie es hier: <a href="http://www.ihrwebstarbereich.de/film.mp4">Video herunterladen</a>
</video>

  • Die Werte der Attribute width und height des video-Tags sind entsprechend der Videoauflösung anzupassen.
  • Das Attribut poster enthält den Pfad zum Vorschaubild. Falls kein Vorschaubild verwendet wird, kann das Attribut entfernt werden
  • Das Attribut src des source-Tags enthält den Pfad zum Video. Derselbe Pfad sollte für das Attribut href des a-Tags verwendet werden. Der Text wird dargestellt, falls der Besucher der Webseite einen Browser verwendet, der keine HTML5-Videos abspielen kann.