Den notwendigen Code dazu erhalten Sie bei dem jeweiligen Content Anbieter- in diesem Fall also Youtube. Öffnen Sie also die Youtube Webseite und suchen Sie dort das passende Video. Anschliessend finden Sie unterhalb des Videos die Funktion TEILEN, welches wiederrum den Unterpunkt EINBETTEN beherbergt. Beim einbetten wird in der Regel ein IFRAME angeboten, der bei dem TinyMCE Editor aus Sicherheitsgründen nicht erlaubt ist.

Stellen Sie deshalb die Funktion "Alten Einbettungscode verwenden" aktiv. Sie können an der Stelle auch gleich bei Bedarf aus der darunter liegenden Größenauswahl eine für Sie interessante Größe für das Video definieren.

Nun holen Sie sich den Einbettungs Code, indem Sie einmal in die Codebox Klicken und per STRG C kopieren, in den Zwischenspeicher.

Bei MyVideo finden Sie den Einbettungscode direkt unterhalb des jeweiligen Videos:

Clipfish liefert nur einen IFrame im Code. Hier können Sie Optional aber auch den Pfad verwenden.

Vimeo liefert default ebenfalls zunächst IFrame Links aus, Sie können Optional aber auf den Object Tag umschalten:

Optional können Sie die Videos natürlich auch euf einem eigenen Webserver hinterlegen. Denken Sie nur an das richtige Format. Eine MPG oder AVI Datei ist für die Web Übertragung ungeeignet. Sie ist viel zu groß und es gibt kaum Browser, die diese Videos direkt abspielen können.

Wenn Sie die technische Möglichkeit haben, dieses Videomaterial zu komprimieren bzw. umzuwandeln, so nutzen Sie als Ziel z.B. das Format MPeg4 (MP4, Mv4). Dieses Format ist IPHone/Mobil tauglich, liefert eine recht Gute Qualität bei sehr wenig Speicherbedarf und Sie können mit den aktuelle Browserfunktionen wie HTML 5 diese Videos mit einem einfachen HTML Befehl einbinden.

<video width="320" height="240" controls="controls" autoplay="autoplay">
	<source src="movie.mp4" type="video/mp4" />
	<source src="movie.ogg" type="video/ogg" />
	Your browser does not support the video tag.
</video>

Für ältere Browser benötigen Sie aber weiterhin einen MP4 "Player" wie z.B. den für die gewerbliche Nutzung nicht kostenlosen jw-flv-player. Eingebinden werden die Videos dann per Option Tag wie weiter unten beschrieben.

An diesen Stellen können Sie Videos einbinden:

• Artikeldetails
• Kategorieneinstellungen
• Shopseiten
• Aktionen (HTML-Container)

Sie haben nun mehrere Möglichkeiten den Code einzubinden. Wenn Sie sich mit HTML noch nicht so gut auskennen, sollten Sie den Code zunächst auf Ihrer Arbeitsstation in eine TXT Datei kopieren. Dazu einfach per Rechtsklick an einer freien Stelle auf dem Desktop klicken, im Menü den Punkt NEU / Textdokument wählen. So erzeugen Sie eine leere TXT Datei, in der Sie den im Zwischenspeicher befindlichen Text per STRG V eingeben.

Sehen Sie sich den Code etwas genauer an. Sie finden zwei identische Values, die mit den Zeichen "http" anfangen. Das ist der "Media Link", den wir gleich benötigen. In diesem Beispiel nutzen wir ein Video von Shopware, welches Sie für Ihren Test selbstverständlich verwenden dürfen:

Code:

<object width="560" height="315">
<param name="movie" value="http://www.youtube.com/v/Uh3i2gAa1Fc?version=3&hl=de_DE"></param>
<param name="allowFullScreen" value="true"></param>
<param name="allowscriptaccess" value="always"></param>
<embed src="http://www.youtube.com/v/Uh3i2gAa1Fc?version=3&hl=de_DE" 
type="application/x-shockwave-flash" 
width="560" height="315" 
allowscriptaccess="always" 
allowfullscreen="true"></embed>
</object>

Media Link:

http://www.youtube.com/v/Uh3i2gAa1Fc?version=3&hl=de_DE

Diesen Media Link können Sie nun im TinyMCE Editor Ihrer Artikeldetailseite einbinden. Öffnen Sie dazu einen Artikel Ihrer Wahl und sehen Sie sich den TinyMCE Editor an. Sie finden in der Menüleiste einen Media Button zum einbinden von Videos. Klicken Sie zunächst in die Beschreibung, in der das Video einbebunden werden soll, dann auf den Media Button:

Nun geben Sie den Media Link sowie die Größe des Videos (hier 560px Breite x 315px Höhe) ein:

Im Backend sieht das Video nun etwa so aus, aber auch wenn diese Darstellung vermuten lässt, dass da etwas nicht stimmen würde- das ist so korrekt, denn Sie befinden sich an dieser Stelle ja noch im "Bearbeitungsmodus".

Die "Gelbe" Fläche wird später im Frontend korrekt als Video angezeigt. Im Frontend sieht der Kunde folgenden Darstellung in den Artikeldetails:

Diese Methode ist Interessant, wenn Sie sich bereits mit HTML Code auskennen. Im Editor können die die Wysiwyg Ansicht in die Quellcode Ansicht umschalten. Dort können Sie dann auch den gesamten YouTube-Code schnell und präzise hinterlegen:

Machmal ist es sinnvoll den Video Link als Extra Attributfeld zu Pflegen. Das Layout der Artikeldetailseite ist dann immer identisch und Administrativ kann die Darstellung des Videos auch später problemlos über das Template realisiert werden. Wie Sie Videos über ein Attributfeld nutzen können erklärt der folgenden Wiki Artikel:

• Videos über ein Attributfeld einbinden

Newsletter dienen zur Übertragung von Text und heutzutage auch HTML Befehlen. Javascript ist dort aus gutem Grund default ausgeschaltet. Genau sieht es mit anderen, Image abweichenden Formaten aus. Während CSS, JPG, GIF oder auch PNG Dateien noch "geholt" werden dürfen, bleiben JS, MP3 aber auch MP4 und viele andere Dateien auf der Strecke. Mann kann derzeit pauschal sagen, Videos sind pauschal nicht einbindbar. Sie können aber das Video Standbild als Grafik einbinden und per Link auf Ihr im Shop hinterlegtes Videofile / Shopseite verseisen.

Nun gut, das wäre ein Multimedia Workshop, der hier nichts zu suchen hat. Aber ein Tipp: Sie können bei Youtube fast jedes Format hochladen. Nach dem Upload können Sie dann von jedem hochgeladenen Video eine im MP4 konvertierte Datei auch wieder runterladen- oder Sie verweisen gleich direkt auf das Video bei Youtube und sparen sich die Kosten für den entstehenden Traffik. Alternativ können Sie mit einem Tool wie z.b. das kostenlose Tool www.mirovideoconverter.com die wichtigsten Videoformate zum MP4 oder OGG-Format umwandeln.

Es ist möglich, aber mit Datenbank-Änderungen verbunden. In der Datenbank s_core_config finden Sie einen Eintrag für den TinyMCE Editor, in dem Sie einige Einstellungen u.a. das Frame-Handling einstellen können. Weitere Informationen zu diesem Datenbankeintrag finden Sie auch hier.

Der Link http://youtu.be/otBWvKM4RKg oder http://www.youtube.com/embed/otBWvKM4RKg wurde per Media Button im TinyMCE Editor eingegeben. Aber es ist kein Video zu sehen. Hier wurde der Direktlink zur Video Datei eingegeben. Der Korrekte Link ist wie folgt aufgebaut: http://www.youtube.com/v/otBWvKM4RKg?version=3&hl=de_DE

Sie verwenden die Cache Funktion. Bitte bereinigen Sie den Artikel Cache und aktualisieren Sie das Frontend noch einmal.