WBCE CMS Forum

peted

Mitglied

Lokales Video einbinden

Hallo,

Bin neu hier. Ich hab ein Video (<10 Sek.) auf den Server hochgeladen und möchte es auf einer Seite einbinden. Ich will es ausdrücklich nicht auf youtube, vimeo oder dailymotion hochladen.

Wie kann ich das anstellen?

Gruss - Peter

florian

Administrator

Re: Lokales Video einbinden

Wenn das nur ein Video ist, ist es das einfachste, in die Quellcode-Ansicht des CKEditors umzuschalten und dort den Aufruf des Videos mittels HTML5-Video-Tag einzufügen:

<video controls="" width="250"><source src="https://www.deinedomain.tld/media/deinvideo.mp4" type="video/mp4" /></video>

Kommt das häufiger vor, könnte sich die Verwendung des MP4-Droplets lohnen, siehe dazu https://forum.wbce.org/viewtopic.php?pid=31628#p31628

peted

Mitglied

Re: Lokales Video einbinden

Vielen Dank! Auf die Idee mit Quellcode-Ansicht war ich bisher nicht gekommen (bin Anfänger). ;-)

Ich hab es so gelöst, dass ich ein Dummy-Youtube-Video eingefügt hab, und in der Quellcode-Ansicht die URL mit der gewünschten vom Server-Video ersetzt hab. Sieht alles gut aus.

Warum wird das im UI verhindert?

florian

Administrator

Re: Lokales Video einbinden

Warum wird das im UI verhindert?

Was meinst Du damit?

peted

Mitglied

Re: Lokales Video einbinden

Wenn ich versuche, ein Video im CKEditor einzubinden und eine URL angebe, die nicht mit youtube, vimeo oder dailymotion beginnt, passiert nichts, d.h. es wird kein Objekt eingefügt.

Wenn ich eine Youtube-URL einfüge, ist alles ok, das Objekt wird angezeigt. Auf diese Weise konnte ich im Quellcode die Youtube-URL durch die gewünschte ersetzen. Es ist aber offensichtlich, dass im CKEditor die URL abgefragt wird und das Einfügen nur bei den 3 großen Plattformen erlaubt ist.

Das war der Kern meiner Frage. Warum werden andere URLs (sogar die vom eigenen Server) verhindert?

Beitrag geändert von peted (15.06.2024 14:37:38)

florian

Administrator

Re: Lokales Video einbinden

Ach so. Du meinst das Video Embed-Plugin. 
Das funktioniert anders, d.h. es generiert aus dem Share-Link der jeweiligen Videoplattform den benötigten Embed-Code, der ja auch ganz anders aufgebaut ist.

Aufruf eines lokalen Videos:

<video controls="" width="250">
<source src="https://www.deinedomain.tld/media/deinvideo.mp4" type="video/mp4" />
</video>

Embed-Code für Youtube, wie er vom Media Embed-Plugin generiert wird:

<div class="embeddedContent" 
  style="left: 0; width: 100%; height: 0; 
  position: relative; padding-bottom: 56.2493%;">
  <iframe allowfullscreen="" 
   loading="lazy" src="https://www.youtube.com/embed/EOIvnRUa3ik" 
   style="border: 0; top: 0; left: 0; width: 100%; height: 100%; position: absolute;">
  </iframe>
</div>

Insofern weiß ich jetzt auch nicht, wie Dir die Youtube-URL weitergeholfen haben könnte.

Mit dem Einfügen direkt im Quellcode ist das zugegebenermaßen nicht optimal gelöst, auch wenn es ja funktioniert.
Komfortabler wäre es direkt über die GUI, ich nehme das mal auf die To-Do-Liste.

Beitrag geändert von florian (15.06.2024 14:47:10)

peted

Mitglied

Re: Lokales Video einbinden

Genau dieser Code wurde beim Einfügen generiert. So sieht das Ergebnis aus (ganz unten):
<oops>, ich darf noch keine URLs posten, bin zu neu hier.

Kannst unter theatergassen.de -> Aktuelles -> The Last Dance schauen, auf der Seite ganz unten.

florian

Administrator

Re: Lokales Video einbinden

Beide Wege funktionieren (erstaunlicherweise).

Wer häufiger lokale Videos einbinden will, kann sich in der Tat die Arbeit mittels des CKEditor-Plugins html5-video erleichtern.
Dazu:
1. Von https://github.com/SedueRey/ckeditor-ht … ses/latest den Sorce Code (zip) herunterladen
2. Lokal entpacken
3. Per FTP Verzeichnis html5video nach /modules/ckeditor/ckeditor/plugins kopieren, Datei LICENSE und readme.md nach /modules/ckeditor/ckeditor/plugins /html5video kopieren
4. /modules/ckeditor/include.php mit geeignetem Editor öffnen und Zeile 117

$ckeditor->config['extraPlugins']    = 'ckawesome,codemirror,textselection,wbdroplets,wbembed,wblink,wbsave,wbshybutton,autolink,colorbutton,copyformatting,font,indentblock,justify,lineutils,panelbutton,textmatch,widgetselection';

ändern zu

$ckeditor->config['extraPlugins']    = 'ckawesome,codemirror,textselection,wbdroplets,wbembed,wblink,wbsave,wbshybutton,autolink,colorbutton,copyformatting,font,indentblock,justify,lineutils,panelbutton,textmatch,widgetselection,html5video';

(also kurz gesagt einfach nur "html5video" am Ende vor dem Hochkomma ergänzen)
5. Ggf. Browsercache leeren und Backend neu laden.

Und das war es schon! Nun erscheint dort ein neuer Button, mittels dem lokal gespeicherte Videos eingefügt werden können.

Beitrag geändert von florian (16.06.2024 18:42:00)

peted

Mitglied

Re: Lokales Video einbinden

Sehr hilfreich, vielen Dank!

Edit:
Gerade deine Prozedur ausgeführt, das Plugin ist da und funktioniert.
Danke nochmal!

Beitrag geändert von peted (16.06.2024 21:04:12)