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 [2013/05/23 11:07] jz1001einbinden_von_videos_podcasts_in_eine_webseite [2014/11/02 12:32] – [Einbidnen von mp3 Audiodateien] jz1001
Zeile 1: Zeile 1:
-====== Einbinden von Videos und Podcasts in eine Webseite ======+====== Einbinden von Videos und (Audio-)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.
 Das Video liegt bereits in einem passendem Format (MPEG-4, FLV mit Streaming - siehe „[[videokonvertierung|Konvertieren von Videos]]“) vor. Zum hochladen der Videodatei öffnen Sie im Webbrowser folgenden Link: Das Video liegt bereits in einem passendem Format (MPEG-4, FLV mit Streaming - siehe „[[videokonvertierung|Konvertieren von Videos]]“) vor. Zum hochladen der Videodatei öffnen Sie im Webbrowser folgenden Link:
 +
 +====== Hochladen der Audio bzw. Video Datei auf den Podcastserver ======
  
 https://podcast2.ruf.uni-freiburg.de:8170/podcastproducer/capture/login\\ https://podcast2.ruf.uni-freiburg.de:8170/podcastproducer/capture/login\\
Zeile 19: Zeile 21:
 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. 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 anschließend eine Emailbenachrichtigung.  Sie erhalten anschließend eine Emailbenachrichtigung. 
 +
 +====== Einbinden in eine Webseite======
  
 Öffnen Sie den in der Email enthaltenen Link zu Ihrem Video.\\ Öffnen Sie den in der Email enthaltenen Link zu Ihrem Video.\\
Zeile 28: Zeile 32:
 Sie müssen nur den Teil ab movie/.. in das unten stehende Skript kopieren und dieses in Ihre Webseite einbinden.   Sie müssen nur den Teil ab movie/.. in das unten stehende Skript kopieren und dieses in Ihre Webseite einbinden.  
    
 +==== Einbinden von Videos ====
 Diese Skript kopieren Sie in Ihre Webseite und ändern den Pfad zum Video: Diese Skript kopieren Sie in Ihre Webseite und ändern den Pfad zum Video:
    
-  <script type="text/javascript" src="http://www.streaming.uni-freiburg.de/skripte/flash/embedvideo_new.js"></script> +  <script type="text/javascript" src="https://www.streaming.uni-freiburg.de/skripte/flash/embedvideo_new.js"></script> 
   <script type="text/javascript">   <script type="text/javascript">
   var embedHTML = new media('movie/UNI-Account/meinVideo.mp4','',360,640,'','','07','player_1');   var embedHTML = new media('movie/UNI-Account/meinVideo.mp4','',360,640,'','','07','player_1');
Zeile 45: Zeile 49:
 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" src="https://www.streaming.uni-freiburg.de/skripte/flash/embedvideo_new.js"></script> 
   <script type="text/javascript">   <script type="text/javascript">
   var embedHTML = new media('movie/jz1099/2013-02-23/meinfilm.mp4','',360,640,'','','07','player_1');   var embedHTML = new media('movie/jz1099/2013-02-23/meinfilm.mp4','',360,640,'','','07','player_1');
Zeile 65: Zeile 69:
 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" src="https://www.streaming.uni-freiburg.de/skripte/flash/embedvideo_new.js"></script> 
   <script type="text/javascript">   <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');   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();    embedHTML.writeHTML(); 
-  </script>\\ +  </script> 
-\\+   
 +  
 **Beispiel mit Posterbild und mit Playbutton-Titel:**\\ **Beispiel mit Posterbild und mit Playbutton-Titel:**\\
 Sie können am Playbutton einen Titel einfügen zum Beispiel "Play Podcast"\\ 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:\\ 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" src="https://www.streaming.uni-freiburg.de/skripte/flash/embedvideo_new.js"></script> 
   <script type="text/javascript">   <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');   var embedHTML = new media('movie/jz1099/2013-02-23/meinfilm.mp4','',360,640,'/Bilder/playerbackground.jpg','Play Podcast','07','player_1');
Zeile 89: Zeile 94:
 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'.\\ 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'.\\
  
 +==== Einbidnen von mp3 Audiodateien ====
 +Sie könne Audiodateien auf zwei verschiedene Arten einbidnen: zum einen als flachen, einzeiligen Player und zum anderen als "Quasi"-Player mit schwarzen Hintergrund:
 +
 +=== Flacher Player ===
 +
 +Dieses Skript kopieren Sie in den Quelltext (HTML) ihrer Webseite und ändern den Pfad zur Audiodatei:
 +
 +
 +  <script type="text/javascript" src="https://www.streaming.uni-freiburg.de/skripte/flash/embedvideo_new.js"></script> 
 +  <script type="text/javascript">
 +  var embedHTML = new media('movie/UNI-Account/meinAudio.mp3','','40',300,'','','20','player_1');
 +  embedHTML.writeHTML(); 
 +  </script>
 +
 +
 +=== Großer Player ===
 +Um einen großen Player (ähnlich dem Video Format) mit optionalem Posterbild zu bekommen, verwenden Sie einfach das folgende Script zum Einbetten Ihrer Audiodatei. Das Postbild wird genau wie bei bei Videos eingebunden (siehe oben).
 +
 +  <script type="text/javascript" src="https://www.streaming.uni-freiburg.de/skripte/flash/embedvideo_new.js"></script> 
 +  <script type="text/javascript">
 +  var embedHTML = new media('movie/UNI-Account/meinAudio.mp3','','180',300,'','','21','player_1');
 +  embedHTML.writeHTML(); 
 +  </script>
  
 {{tag>video streaming podcasts}} {{tag>video streaming podcasts}}
QR-Code
QR-Code einbinden_von_videos_podcasts_in_eine_webseite (erstellt für aktuelle Seite)