Unterschiede

Hier werden die Unterschiede zwischen zwei Versionen angezeigt.

Link zu dieser Vergleichsansicht

Beide Seiten der vorigen RevisionVorhergehende Überarbeitung
Nächste Überarbeitung		Vorhergehende Überarbeitung
Nächste ÜberarbeitungBeide Seiten der Revision
einbinden_von_videos_podcasts_in_eine_webseite [2011/06/17 11:18] – jz1001einbinden_von_videos_podcasts_in_eine_webseite [2013/05/23 11:07] – jz1001
Zeile 1: Zeile 1:
 +====== Einbinden von Videos und Podcasts in eine Webseite ======
 +
 <note important>Diese Anleitung gilt nur für Videos, die auf dem Videoserver Podcast2 liegen</note> <note important>Diese Anleitung gilt nur für Videos, die auf dem Videoserver Podcast2 liegen</note>
 Damit das Video mit diesem Skript in eine Webseite eingebunden werden kann, muss die Videodatei zuerst auf den Videoserver hochgeladen werden. Damit das Video mit diesem Skript in eine Webseite eingebunden werden kann, muss die Videodatei zuerst auf den Videoserver hochgeladen werden.
Zeile 15: Zeile 17:
  
 Anschließend noch auf Veröffentlichen klicken. Anschließend noch auf Veröffentlichen klicken.
-Ihr Video wird nun auf den Server hochgeladen. +Ihr Video wird nun auf den Server hochgeladen und geprüft. Diese Überprüfung kann je nach Größe der Videodatei einige Zeit in Anspruch nehmen. 
-Sie erhalten nach einigen Minuten automatisch eine Emailbenachrichtigung. +Sie erhalten anschließend eine Emailbenachrichtigung. 
  
-Öffnen Sie den in der Emailbenachrichtigung enthaltenen Link zu Ihrem Video.\\+Öffnen Sie den in der Email enthaltenen Link zu Ihrem Video.\\
 {{:video:pcp2_email.jpg|}}\\ {{:video:pcp2_email.jpg|}}\\
  
Zeile 27: Zeile 29:
    
  
-Skript zum einbinden des Videos in eine Webseite:+Diese Skript kopieren Sie in Ihre Webseite und ändern den Pfad zum Video:
    
-<note tip><script type="text/javascript" src="http://www.streaming.uni-freiburg.de/skripte/flash/embedvideo.js"></script> +  <script type="text/javascript" src="http://www.streaming.uni-freiburg.de/skripte/flash/embedvideo_new.js"></script>  
-<script type="text/javascript"> +  <script type="text/javascript"> 
- var embedHTML = new media('movie/Ihr_UNI-ACCOUNT_Name/DATUMSORDNER/VIDEONAME.mov',240,320,'','00'); +  var embedHTML = new media('movie/UNI-Account/meinVideo.mp4','',360,640,'','','07','player_1'); 
- embedHTML.writeHTML();  +  embedHTML.writeHTML();  
-</script> +  </script> 
-</note> + 
-\\ + 
-Die Zahlen 240,320 hinter dem Videopfad im Skript definieren die Videogröße (Höhe, Breite) auf Ihrer Webseite. Dies können Sie nach Ihren Bedürfnissen anpassen.\\+Die Zahlen 360,640 hinter dem Videopfad im Skript definieren die Videogröße (Höhe, Breite) auf Ihrer Webseite. Dies können Sie nach Ihren Bedürfnissen anpassen.\\
 \\ \\
 **Beispiel:**\\ **Beispiel:**\\
 Die HTTP-Adresse im Webbrowser lautet:\\ Die HTTP-Adresse im Webbrowser lautet:\\
-http://podcast2.ruf.uni-freiburg.de/movie/jz1099/2011-06-23/meinfilm.mov\\+http://podcast2.ruf.uni-freiburg.de/movie/jz1099/2011-06-23/meinfilm.mp4\\
 Dann muss in dem Skript die Zeile mit "var embedHTML = new media...." folgendermaßen geändert werden:\\ Dann muss in dem Skript die Zeile mit "var embedHTML = new media...." folgendermaßen geändert werden:\\
 + 
 +  <script type="text/javascript" src="http://www.streaming.uni-freiburg.de/skripte/flash/embedvideo_new.js"></script> 
 +  <script type="text/javascript">
 +  var embedHTML = new media('movie/jz1099/2013-02-23/meinfilm.mp4','',360,640,'','','07','player_1');
 +  embedHTML.writeHTML(); 
 +  </script>
 +  
 +\\
  
-{{:video:pcp2_script_embedhtml.png|}}\\+**Erklärung der Zeile new media:**\\
 \\ \\
 +Zwischen den einzelnen Hochkommas '' können Sie unterschiedliche Informationen oder Parameter mitgeben. Das ganze baut sich folgendermaßen auf:\\
 +
 +('Pfad Videodatei','HD-Version',360(Player-Höhe),640(Player-Breite),'Vorschaubild','Playbutton-Titel','07(Skript-ID),'eindeutige Player ID')\\
 +\\
 +
 +**Beispiel mit Posterbild:**\\
 +Kopieren Sie Ihr Posterbild auf Ihren Webserver und fügen die vollständige URL in das Skript hinter der Videogröße und zwischen den zwei Hochkommas '' ein. Beispiel Pfad zum Posterbild:\\
 +http://www.webserver.de/ordner/posterbild.jpg\\
 +Dann muss in dem Skript die Zeile mit "var embedHTML = new media...." folgendermaßen geändert werden:\\
 + 
 +  <script type="text/javascript" src="http://www.streaming.uni-freiburg.de/skripte/flash/embedvideo_new.js"></script> 
 +  <script type="text/javascript">
 +  var embedHTML = new media('movie/jz1099/2013-02-23/meinfilm.mp4','',360,640,'http://www.webserver.de/ordner/posterbild.jpg','','07','player_1');
 +  embedHTML.writeHTML(); 
 +  </script>\\
 +\\
 +**Beispiel mit Posterbild und mit Playbutton-Titel:**\\
 +Sie können am Playbutton einen Titel einfügen zum Beispiel "Play Podcast"\\
 +Dann muss in dem Skript die Zeile mit "var embedHTML = new media...." folgendermaßen geändert werden:\\
 + 
 +  <script type="text/javascript" src="http://www.streaming.uni-freiburg.de/skripte/flash/embedvideo_new.js"></script> 
 +  <script type="text/javascript">
 +  var embedHTML = new media('movie/jz1099/2013-02-23/meinfilm.mp4','',360,640,'/Bilder/playerbackground.jpg','Play Podcast','07','player_1');
 +  embedHTML.writeHTML(); 
 +  </script>
 +
 +Dann sieht der Player folgendermaßen aus:\\
 +\\
 +{{:video:playbutton.png?200|}}\\
 +\\
 +**Mehrere Videos gleichzeitig auf eine HTML-Seite einbinden**\\
 +\\
 +Jedes Video benötigt eine eindeutige und gültige Player-ID. Wenn Sie also mehrere Videos auf eine einzige HTML-Seite einbinden möchten, dann müssen Sie jedem Video eine eindeutige ID geben. Ändern Sie dazu am Ende der Zeile "var embedHTML = new media..." die Player-ID und zählen für jedes Video hoch, also 'player_1' und für das nächste Video 'player_2'.\\
 +
  
-{{tag>video streaming}}+{{tag>video streaming podcasts}}

Zuletzt angesehen:

QR-Code
QR-Code einbinden_von_videos_podcasts_in_eine_webseite (erstellt für aktuelle Seite)