[GELÖST] <![CDATA[ nach Einbau von Video

brandy · 03. September 2013 20:04

Hallo!

Ich wollte gerade diesen Code in einen Artikel des Moduls "News" einbauen:

Hier klicken, um den Code zum Kopieren zu markieren

<script src="//embed.flowplayer.org/5.4.3/embed.min.js">
<div class="flowplayer" style="width: 480px; height: 270px;">
      <video>
         <source type="video/webm" src="video.webm">
      </video>
</div>
</script>

Gehe ich jetzt auf "WYSIWYG aktivieren/deaktivieren" und wieder zurück macht er das daraus:

Hier klicken, um den Code zum Kopieren zu markieren

<script type="text/javascript" src="http://embed.flowplayer.org/5.4.3/embed.min.js">// <![CDATA[
<div class="flowplayer" style="width: 480px; height: 270px;">
      <video>
         <source type="video/webm" src="video.webm">
      </video>
</div>
// ]]></script>

Wie kann ich das vermeiden?

Beitrag geändert von brandy (03. September 2013 20:09)

NaN · 03. September 2013 20:30

Sowas macht man einfach nicht. HTML Code hat im WYSIWYG Editor nichts verloren. Abgesehen davon ist der Code falsch. Was macht der HTML Code im Script-Tag? Für sowas würde ich eher ein Plugin oder UDT verwenden.

brandy · 03. September 2013 21:10

Und wie würd ich das machen - wollt es schon in einen benutzerdefinierten Tag packen, hat aber nicht gut funktioniert :-)

Beitrag geändert von brandy (04. September 2013 06:40)

brandy · 04. September 2013 07:40

Ok - mit diesem hier sollte das auch funktionieren, oder?
http://dev.cmsmadesimple.org/projects/hva

brandy · 04. September 2013 20:24

Was schlägt ihr da vor wie ich das am Besten einbaue?

Klenkes · 05. September 2013 08:24

brandy schrieb:

Was schlägt ihr da vor wie ich das am Besten einbaue?

Wenn es nur 1 Video ist kannst du den Code doch in einen GCB setzen und den im TinyMCE einsetzen. Das sollte funktionieren.
Wenn du mehrere Videos listen willst, und ein Kunde soll das bearbeiten können, empfehle ich ein Modul mit ListIt2 zu machen.

Abgesehen davon, sollte das HTML dazu so ausehen:

Hier klicken, um den Code zum Kopieren zu markieren

<script src="//embed.flowplayer.org/5.4.3/embed.min.js"></script>
<div class="flowplayer" style="width: 480px; height: 270px;">
      <video>
         <source type="video/webm" src="video.webm">
         <source type="video/mp4" src="video.mp4">
      </video>
</div>

Beitrag geändert von Klenkes (05. September 2013 08:32)

NaN · 05. September 2013 08:25

Stimmt. GCB hatte ich ganz vergessen. Das wäre wirklich die einfachste Methode.

brandy · 05. September 2013 09:09

Ok stimmt - es geht nur um ein Video und das soll auch nicht vom Kunden bearbeitet werden können!
Vielen Dank...

brandy · 05. September 2013 09:19

Wie bau ich das aber ein?
Bau ich es im HTML-Modus ein, löscht er mir das meiste wieder weg sobald diesen verlasse!
Auch {literal} reißt mich nicht raus...?

NaN · 05. September 2013 09:37

Du kannst doch bei einem Globalen Inhaltsblock den WYSIWYG Editor dauerhaft deaktivieren.
{literal} brauchst Du nicht, da Du ja keine geschweiften Klammern im HTML Code hast.

brandy · 05. September 2013 09:57

Ok, cool...
Vielen Dank, funktioniert so wie ich es wollte...
Danke!

kampkrusty · 11. September 2013 09:30

Für einfache Videoimplementation hatte klenkes auch mal ein Plugin geschrieben:

Hier klicken, um den Code zum Kopieren zu markieren

[== PHP ==]
<?php  function smarty_cms_function_myvideoplugin($params, &$smarty) {
$vid = isset($params['vid']) ? $params['vid'] : ""; 
$width = isset($params['width']) ? $params['width'] : 320;  
$height = isset($params['height']) ? $params['height']: 240;  
echo ' <video class="hide-in-ie8" controls="true" height="'.$height.'" width="'.$width.'" preload="none">    
  <source src="/uploads/video/'.$vid.'.webm" type="video/webm"> 
Ihr Browser unterstützt html5 und damit dieses Video nicht. Bitte nutzen Sie einen Browser in der aktuellsten Version. </video>' ;}  

function smarty_cms_help_function_myvideoplugin() {   
?>   
<h3>Was macht das Plugin?</h3>   
<p>Gibt das Video in HTML5 aus</p>   
<h3>Wie muss ich es einsetzen?</h3>   
<p>z.B. {myvideoplugin vid="pfad_zum_video" width="640" height="480"}<br />   
Dabei aber ohne die Dateiendung, weil ein gleichnamiges .webm vorausgesetzt wird.   </p>   
<h3>Parameter</h3>   
<ul>   	
<li><tt>vid</tt> - Pfad zum Video</li>   	
<li><tt>width</tt> - width Wert</li>   	
<li><tt>height</tt> - height Wert</li>   
</ul>   
<?php 
}  

function smarty_cms_about_function_myvideoplugin() { 
?>   
<p>Author:  Bernd Klenk (klenkes)</p>   
<p>Version 0.1</p> 
<?php 
} 
?>

Ich habe den Code auf meine Anforderungen hin angepasst. Den Originalcode hat klenkes bestimmt noch. wink

Klenkes · 11. September 2013 09:55

kampkrusty schrieb:

Den Originalcode hat klenkes bestimmt noch.

Stimmt! Hatte ich ganz vergessen lol
Muss ich mir mal wieder anschauen...

Dancer62 · 07. Oktober 2014 08:25

Ich hab mir den Originalcode von Klenkes auch mal angepasst und das Plugin ins /plugin/-Verzeichnis hochgeladen. Wenn ich jetzt auf der Seite das Video mit

Hier klicken, um den Code zum Kopieren zu markieren

{myvideoplayer vid='nachwuchswerbung_h720p'}

aufrufen will, bekomme ich die Fehlermeldung

Hier klicken, um den Code zum Kopieren zu markieren

Syntax error in template "content:Block_mitte"  on line 4 "{myvideoplayer vid='nachwuchswerbung_h720p'}" unknown tag "myvideoplayer"

Was habe ich vergessen, da CMSms offensichtlich mein Plugin (noch) nicht erkennt ?

NaN · 07. Oktober 2014 08:38

Wie genau heißt die Datei im Plugin-Verzeichnis?
Wie genau heißt die Funktion im Plugin?

Bsp.:

Datei: function.[Name des Plugins].php
Funktion: function smarty_function_[Name des Plugins] ($params, &$smarty)

Dancer62 · 07. Oktober 2014 11:32

Jaja, wer lesen kann, ist eindeutig im Vorteil... hmm

Habe doch glatt "myvideoplayer" statt "myvideoplugin" gelesen - dann kann es natürlich nicht funktionieren. Jetzt läuft es, aber dafür habe ich jetzt ein anderes Problem : ich habe das Video in den Formaten .webm, .mp4, .mov und .ogv hochgeladen (da ich nicht weiß, welches Format tatsächlich benötigt wird). Der Browser meldet mir aber (im Videoplayer) "Kein Video mit unterstütztem Format und MIME-Typ gefunden.". Die entsprechende Passage bei mir lautet

Hier klicken, um den Code zum Kopieren zu markieren

[== php ==]
echo '
<video class="hide-in-ie8" controls="true" height="'.$height.'" width="'.$width.'">
   <source src="{root_url}/uploads/videos/firefighter/'.$vid.'.webm" type="video/webm"> 
   <source src="{root_url}/uploads/videos/firefighter/'.$vid.'.mp4" type="video/mp4"> 
   <source src="{root_url}/uploads/videos/firefighter/'.$vid.'.mov" type="video/quicktime"> 
   <source src="{root_url}/uploads/videos/firefighter/'.$vid.'.ogv" type="video/ogg">
Ihr Browser unterstützt HTML5 und damit dieses Video nicht. Bitte nutzen Sie einen Browser in der aktuellsten Version.
</video>'

Habe ich etwas vergessen (Video-Format) oder falsch angegeben ? Der Videoplayer zeigt ganz kurz den Startbildschirm mit dem "Dreieck zum Starten", schaltet danach aber sofort auf die Fehlermeldung um.

B.t.w.: wo und wie ist die Class "hide-in-ie8" definiert bzw. brauche ich die überhaupt ?

NaN · 07. Oktober 2014 11:44

Das Attribut "src" bei den <source> Tags ist falsch. (Anführungszeichen bzw. "SMARTY ist nicht PHP" sag ich da nur wink ).
Ergänze das Plugin mal folgendermaßen:

$config = cmsms()->GetConfig();
echo '
<video class="hide-in-ie8" controls="true" height="'.$height.'" width="'.$width.'">
<source src="' . $config['uploads_url'] . '/videos/firefighter/'.$vid.'.webm" type="video/webm">
<source src="' . $config['uploads_url'] . '/videos/firefighter/'.$vid.'.mp4" type="video/mp4">
<source src="' . $config['uploads_url'] . '/videos/firefighter/'.$vid.'.mov" type="video/quicktime">
<source src="' . $config['uploads_url'] . '/videos/firefighter/'.$vid.'.ogv" type="video/ogg">
Ihr Browser unterstützt HTML5 und damit dieses Video nicht. Bitte nutzen Sie einen Browser in der aktuellsten Version.
</video>'

Ansonsten ist diese Fehlermeldung ein Zeichen dafür, dass der Browser unter der angegebenen URL kein Video finden kann.
Die Videos sollten also im Verzeichnis "/uploads/videos/firefighter/..." liegen.

Klenkes · 07. Oktober 2014 12:02

Das class="hide-in-ie8" ist noch ein Überbleibsel von mir und einem bestimmten Projekt.
Du kannst es einfach löschen.

Dancer62 · 07. Oktober 2014 14:23

Ich krieg es einfach nicht hin.
Code so wie er ist rauskopiert und ins PHP-Skript eingefügt -> Fehlermeldung wie vorher.
Code um Leerzeichen bereinigt und ins PHP-Skript eingefügt -> Fehlermeldung wie vorher.
Ich rufe das Plugin auf mit

Hier klicken, um den Code zum Kopieren zu markieren

{myvideoplugin vid='nachwuchswerbung_h360p'}

Kann es evtl. an den Video-Dateien selbst liegen (z.B. falsche/fehlerhafte Codierung) ? Und falls ja, wie könnte ich das überprüfen ?
Kann ich feststellen, auf welchen Pfad er tatsächlich zugreift (vielleicht habe ich ja doch irgendwo einen Schreibfehler eingebaut) ?

So langsam verzweifele ich an diesem ganzen Sch... mad

NaN · 07. Oktober 2014 14:40

Öffne Deine Seite auf der Das Video angezeigt werden soll im Firefox.
Drücke die Taste [F12].
Es sollte sich ein Fenster mit Entwickler-Tools öffnen.
Dort gibt es einen Tab namens "Netzwerk" (Firebug) bzw. "Netzwerkanalyse" (eingebaute Entwickler-Tools). Draufklicken, die Seite neu laden und die Netzwerkvorgänge beobachten.
Da steht dann sowas wie "200 GET ... Deine Domain".
Das sind alles Anfragen, die an Deinen Server gesendet werden. CSS, Javascripts, Bilder etc.
Suche in dieser Tabelle nach dem Video.
Was steht dort in der Zeile?

Klicke auf den Eintrag mit dem Video und lass Dir die Header-Daten bzw. die Antwort vom Server anzeigen. (Im Firebug die Zeile aufklappen und auf den Tab "Header" bzw. "Antwort" klicken; in den eingebauten Entwickler-Tools den Eintrag auswählen und dann rechts unter "Kopfzeilen" bzw. "Antwort" schauen)

So analysierst Du, welche Anfragen Deine Webseite alles an den Server stellt und ob diese Erfolgreich waren bzw. wenn nicht, warum.

Entweder findet der Server das Video nicht, weil es in einem anderen Verzeichnis ist, oder es darf von außen nicht darauf zugegriffen werden oder es wird tatsächlich der falsche MIME-Type vom Server gesendet. (Das siehst Du im Bereich "Antwort-Header" bzw. "Antwortkopfzeile" unter "Content-Type")

Klenkes · 07. Oktober 2014 14:55

Ein Direktaufruf im Browser bringt mir einen 403 Forbidden.

Ich hatte auch schon erlebt, dass Serveradmins noch keine aktuellen MIME-Types konfiguriert hatten. Da schufen diese Zeilen in der htaccess im root-DIR Abhilfe:

Hier klicken, um den Code zum Kopieren zu markieren

AddType video/mp4 .mp4 .m4v
AddType audio/mp4 .m4a
AddType video/ogg .ogv
AddType audio/ogg .ogg .oga
AddType video/webm .webm

Dancer62 · 07. Oktober 2014 16:36

Offenbar habt ihr beide Recht, da ich für alle vier Dateitypen einen "403 Forbidden" zurückbekomme. Ich habe auch schon versucht, in der .htaccess im root-Verzeichnis die von Klenkes vorgeschlagenen Änderungen durchzuführen (inkl. Löschen des Zwischenspeichers) - jedoch ohne Erfolg. Warum wird der Zugriff auf die Dateien nicht erlaubt und - viel wichtiger - wie kann ich es wieder erlauben ?

Nachtrag: So sehen die Daten der ersten Anfrage für .webm aus
Antwort-Header
HTTP/1.1 403 Forbidden
Date: Tue, 07 Oct 2014 15:26:48 GMT
Server: Apache
Content-Length: 256
Keep-Alive: timeout=5, max=97
Connection: Keep-Alive
Content-Type: text/html; charset=iso-8859-1

Anfrage-Header
GET /uploads/videos/firefighter/nachwuchswerbung_h360p.webm HTTP/1.1
Host: http://www.feuerwehr-bockhorn.de
User-Agent: Mozilla/5.0 (Windows NT 6.1; WOW64; rv:32.0) Gecko/20100101 Firefox/32.0
Accept: video/webm,video/ogg,video/*;q=0.9,application/ogg;q=0.7,audio/*;q=0.6,*/*;q=0.5
Accept-Language: de,en-US;q=0.7,en;q=0.3
DNT: 1
Range: bytes=0-
Referer: http://www.feuerwehr-bockhorn.de/index. … =aktuelles
Cookie: CMSSESSID2e413d43=b7253345465657ef9eb7ce1481065159; _sx_=acafcb6a174180fd; cms_admin_user_id=1; cms_passhash=e18108bd26398fe869d688371a93b7b7
Connection: keep-alive

Beitrag geändert von Dancer62 (07. Oktober 2014 16:43)

NaN · 07. Oktober 2014 16:44

Es gibt zwei Gründe dafür.

1. Du (bzw. Dein Vorgänger) hast in einer .htaccess-Datei den Zugriff im Uploads-Ordner aus Sicherheitsgründen nur auf bestimmte Dateitypen erlaubt und dabei Videos übersehen.

2. Je nachdem wie Du die Dateien hochgeladen/den Ordner erstellt hast, haben sie nicht die nötigen Zugriffsrechte, um "von außen" aus erreichbar zu sein (Stichwort CHMOD).

Wie hast Du die Dateien hochgeladen? FTP? Dann kannst Du die Zugriffsrechte über das FTP Programm setzen.
Über den FileManager? Dann musst Du das über den FileManager versuchen.

Dancer62 · 07. Oktober 2014 16:59

NaN schrieb:

Es gibt zwei Gründe dafür.
1. Du (bzw. Dein Vorgänger) hast in einer .htaccess-Datei den Zugriff im Uploads-Ordner aus Sicherheitsgründen nur auf bestimmte Dateitypen erlaubt und dabei Videos übersehen.

Ich habe folgende Einträge in meiner .htaccess-Datei im Verzeichnis "uploads" (die Unterverzeichnisse darin haben keine .htaccess)

Hier klicken, um den Code zum Kopieren zu markieren

order deny,allow
deny from all

<Files *.*> 
Order deny,allow
Deny from All
</Files>

<Files ~ "\.(ico|ICO|css|js|gif|jpe?g|png|pdf|txt|doc|wri|rtf|xls|ppt|pps|csv|xml|mp3|dcr|swf|avi|mov|flv|CSS|JS|GIF|JPE?G|PNG|PDF|TXT|DOC|WRI|RTF|XLS|PPT|PPS|CSV|XML|MP3|DCR|SWF|AVI|MOV|FLV)$">
Order allow,deny
Allow from all
</Files>

DirectoryIndex index.html

NaN schrieb:

2. Je nachdem wie Du die Dateien hochgeladen/den Ordner erstellt hast, haben sie nicht die nötigen Zugriffsrechte, um "von außen" aus erreichbar zu sein (Stichwort CHMOD).

Alle Ordner unterhalb des root-Verzeichnisses haben die Berechtigung "0755"

NaN schrieb:

Wie hast Du die Dateien hochgeladen? FTP? Dann kannst Du die Zugriffsrechte über das FTP Programm setzen.
Über den FileManager? Dann musst Du das über den FileManager versuchen.

Ich habe die Dateien über den FileManager hochgeladen, kann aber natürlich die Berechtigungen auch über FileZilla setzen. Momentan haben alle Video-Dateien die Berechtigung "0644".

NaN · 07. Oktober 2014 18:29

Na bitte. In der .htaccess fehlen genau die Datei-Typen, die Du haben willst.
Also einfach in diese Liste (<files ~ ... >) diese Endungen (mp4|m4v|m4a|ogv|oga|webm) hinzufügen. (notalls doppelt - einmal groß und einmal klein)
Die Zugriffsrechte sollten so ausreichen.

Forum für CMS/made simple

#1 03. September 2013 20:04

[GELÖST] <![CDATA[ nach Einbau von Video

#2 03. September 2013 20:30

Re: [GELÖST] <![CDATA[ nach Einbau von Video

#3 03. September 2013 21:10

Re: [GELÖST] <![CDATA[ nach Einbau von Video

#4 04. September 2013 07:40

Re: [GELÖST] <![CDATA[ nach Einbau von Video

#5 04. September 2013 20:24

Re: [GELÖST] <![CDATA[ nach Einbau von Video

#6 05. September 2013 08:24

Re: [GELÖST] <![CDATA[ nach Einbau von Video

#7 05. September 2013 08:25

Re: [GELÖST] <![CDATA[ nach Einbau von Video

#8 05. September 2013 09:09

Re: [GELÖST] <![CDATA[ nach Einbau von Video

#9 05. September 2013 09:19

Re: [GELÖST] <![CDATA[ nach Einbau von Video

#10 05. September 2013 09:37

Re: [GELÖST] <![CDATA[ nach Einbau von Video

#11 05. September 2013 09:57

Re: [GELÖST] <![CDATA[ nach Einbau von Video

#12 11. September 2013 09:30

Re: [GELÖST] <![CDATA[ nach Einbau von Video

#13 11. September 2013 09:55

Re: [GELÖST] <![CDATA[ nach Einbau von Video

#14 07. Oktober 2014 08:25

Re: [GELÖST] <![CDATA[ nach Einbau von Video

#15 07. Oktober 2014 08:38

Re: [GELÖST] <![CDATA[ nach Einbau von Video

#16 07. Oktober 2014 11:32

Re: [GELÖST] <![CDATA[ nach Einbau von Video

#17 07. Oktober 2014 11:44

Re: [GELÖST] <![CDATA[ nach Einbau von Video

#18 07. Oktober 2014 12:02

Re: [GELÖST] <![CDATA[ nach Einbau von Video

#19 07. Oktober 2014 14:23

Re: [GELÖST] <![CDATA[ nach Einbau von Video

#20 07. Oktober 2014 14:40

Re: [GELÖST] <![CDATA[ nach Einbau von Video

#21 07. Oktober 2014 14:55

Re: [GELÖST] <![CDATA[ nach Einbau von Video

#22 07. Oktober 2014 16:36

Re: [GELÖST] <![CDATA[ nach Einbau von Video

#23 07. Oktober 2014 16:44

Re: [GELÖST] <![CDATA[ nach Einbau von Video

#24 07. Oktober 2014 16:59

Re: [GELÖST] <![CDATA[ nach Einbau von Video

#25 07. Oktober 2014 18:29

Re: [GELÖST] <![CDATA[ nach Einbau von Video

Fußzeile des Forums