HTML5 Video

Svend-Boettcher schrieb am 08.11.2019 um 14:49 Uhr

Grüßt Euch,

ich habe mal wieder einen Knoten, der sich nicht lösen will ...

vielleicht kommt Ihr ja drauf !?

ich nutze die aktuellste Version des MAGIX Web Designer Premium und möchte einen HTML5 Player auf der Webseite integrieren.

Ich füge also im "Platzhalter" >>> "HTML Code (body) folgendes ein:

<!DOCTYPE html>
<html>
<head>
    <title>Video mit Vorschau anzeigen</title>
</head>
<body>
    <video controls poster="vorschaubild.png">
      <source src="myvideo.mp4" type="video/mp4">
      <source src="myvideo.ogg" type="video/ogg">
    </video>
</body>
</html>

Das angegebene Video lege ich in dem Ordner ab, in dem ich auch das Projekt abgelegt habe ...

und dann erscheint auf der Seite:

"Kein Video mit unterstütztem Format und MIME-Typ gefunden"

... die Formate passen !

zweiter Versuch war:

ich lege einen Ordner im Projektorder an, den ich "XY_web_files" nenne und lege die besagten Videos dort ab ...

das Ergebnis: "Kein Video mit unterstütztem Format und MIME-Typ gefunden" ???

Hiiiiiiiiilfeeeeeeeee !

Vielen Dank schon mal für´s Grübeln

Svend

Kommentare

BilderMacher schrieb am 08.11.2019 um 15:35 Uhr

Ziehe das Video per Drag&Drop auf deine Seite, wo es erscheinen soll. Der Web Designer Premium macht dann den Rest.

BeRo schrieb am 08.11.2019 um 15:41 Uhr

[...] das Ergebnis: "Kein Video mit unterstütztem Format und MIME-Typ gefunden" [...]

Die einfachste Lösung hat Dir @BilderMacher ja schon erklärt. Wenn Du aber Ursachenforschung betreiben willst, hier die Erklärung des Problems... 😇

Die Ursache dafür, dass das Video nicht angezeigt wird, liegt am fehlerhaften Pfad zum Video. 😋
Du versuchst, ein Video abzuspielen, das der Browser in dem Pfad sucht, in dem auch die HTML Startdatei "index.htm" liegt, da wird er aber keins finden, weil Du es im 1. Versuch irgendwo auf der Festplatte des PC abgelegt hast und im 2. Versuch über das Hilfsverzeichnis in den Ordner "index_htm_files" kopiert hast, ohne den Pfad im Video TAG entsprechend anzupassen...

Die Lösung:
Behalte die (Hilfsverzeichnis) Methode 2 und kopiere zusätzlich noch die "poster" Datei "vorschaubild.png" in das Hilfsverzeichnis. Dann löschst Du den kompletten Code, den Du für das Einbinden des Videos erstellt hast und fügst stattdessen das u. a. Video TAG ein:

<video width="480" height="335" controls poster="index_htm_files/vorschaubild.png"
source src="index_htm_files/myvideo.mp4" type="video/mp4">
</video>

Nach dem lokalen Export (oder Upload) läuft das Video schon in der Vorschau:

P.S.
Seit ein paar Jahren ist es nicht mehr nötig mehrere Dateiversionen eines Videos zur Verfügung zu stellen. Alle halbwegs modernen Browser könen heute das MP4 Format wiedergeben. Das "ogg" Format muss also nicht mehr sein...

Svend-Boettcher schrieb am 08.11.2019 um 18:28 Uhr

Wie schön, dass es Euch gibt 👍😀 Danke

Svend-Boettcher schrieb am 08.11.2019 um 20:10 Uhr

Läuft !

... bis auf das Vorschaubild ...

BeRo schrieb am 08.11.2019 um 20:20 Uhr

[...] Läuft ! ... bis auf das Vorschaubild ... [...]

Wie weiter oben schon geschrieben, gehört das Vorschaubild ("vorschaubild.png") in das Hilfsverzeichnis "XY_web_files", damit der WD es beim Export/Upload automatisch in das Daten-/Objektverzeichnis "index_htm_files" kopiert.
Wenn Du dann noch im Video TAG das Vorschaubild korrekt referenzierst, wird alles gut... 😊

<video width="480" height="335" controls poster="index_htm_files/vorschaubild.png"
source src="index_htm_files/myvideo.mp4" type="video/mp4">
</video>

Probier's nochmal...

Svend-Boettcher schrieb am 08.11.2019 um 20:31 Uhr

Vielen Dank BeRo