Video

Grundfunktionen in der Übersicht

• Einbindung von HTML5-Videos überall im Shop
• Verwaltung von Produktvideos über Attribute in der WaWi

Hinweis

Dieses Plugin nutzt das frei verfügbare VIDEO.JS.

Installation

Video ist wie jedes Plugin für den JTL Shop 3 schnell und einfach zu installieren, lies hierzu bitte unseren Post zur Installation von JTL Shop Plugins.

Bevor es losgeht

Beachte bitte die Hinweise unter http://videojs.com/#section4 zur Kompatibilität zwischen verschiedenen Video-Formaten und Browsern.

Erstelle für HTML5-Kompatibilität also zumindest OGV- und MP4-Videos. Zum Konvertieren bietet sich z.B. der MiroVideoConverter an.

Bitte beachte, dass das Plugin nicht funktionieren kann, wenn die automatische Quellcode-Reparatur aktiviert ist. Denn die löscht leider alle Video-Elemente automatisch.

Du kannst Dich auch auf mp4 beschränken - in diesem Fall wird z.B. Firefox allerdings auf den Flash-Modus zurückfallen.

Füge die folgenden Zeilen ans Ende der .htaccess-Datei im Wurzelverzeichnis Deines Shops ein:

<ifmodule mod_mime.c>
    AddType video/webm .webm
    AddType video/ogg .ogv
    AddType video/mp4 .mp4
</ifmodule>

Erstellen von Videos an beliebigen Positionen (z.B. CMS-Seiten)

Unter Plugins -> Video kannst Du beliebige Videos hochladen und an der gewünschten Position einfügen. Gib dazu einen PHP-Query-Selektor und die gewünschte Funktion, Höhe und Breite sowie optional einen Titel und eine Beschreibung an. Lade anschließend mindestens 2 verschiedene Video-Formate hoch, um alle Browser abzudecken (siehe Hinweise weiter oben). Alternativ ist es hier auch möglich, externe Links einzutragen. Du kannst auch noch ein Poster hinzufügen, das angezeigt wird, bis das Video startet.

Beispiel Du willst ein Video auf Deiner Startseite anzeigen:

• Gib als Selektor beispielsweise "#startseite-video" ein.
• Als Funktion nutzt du "replace".
• Unter Inhalt -> CMS bearbeite Deine Startseite und füge in den Inhalt im Quellcode-Modus eine leere DIV mit der ID "startseite-video" ein:

<div id="startseite-video"></div>

Erstellen von Produkt-Videos

• Lade Deine Videos mit eindeutigen Dateinamen in das Verzeichnis mediafiles/Videos hoch.
• Gib Deinen Produkten die folgenden Funktionsattribute:
• kk_video_ogv: Dateiname für OGV-Video (empfohlen)
• kk_video_mp4: Dateiname für MP4-Video (empfohlen)
• kk_video_webm: Dateiname für WEBM-Video (optional)
• kk_video_title: Titel des Videos (optional)
• kk_video_description: Beschreibung des Videos (optional)
• kk_video_width: Breite des Videos (optional, sonst Standard-Wert)
• kk_video_height: Höhe des Videos (optional, sonst Standard-Wert)
• kk_video_poster: Dateiname für Poster (relativ zum Pfad mediafiles/Videos, optional, sonst Standard-Wert)
• Hast Du beispielsweise die drei Videos "meinProdukt001.mp4", "meinProdukt001.ogv" und "meinProdukt001.webm", so erstelle für Dein Produkt "meinProdukt 0001" die 3 Attribute "kk_video_ogv", "kk_video_mp4" und "kk_video_webm" und gib jeweils die Dateinamen an.
• Du kannst auch noch das Attribut "kk_video_poster" und als Wert z.B. "meinProdukt001.jpg" angeben, um ein spezielles Poster anzuzeigen.