Video und Dia-Show auf der Homepage einfügen

Transkript

1 Video und Dia-Show auf der Homepage einfügen (Var / bn) Inhalt 1 Einleitung Audio -Files von der Homepage hören mit <media> Video-Files auf der Homepage ansehen mit <media> Video von YouTube einbinden mit <video> Video von vimeo einbinden mit <video> Dia-Show von picasaweb einbinden mit <video> Dia-Show von flickr einbinden mit <video>... 7

2 1 Einleitung Kurze Video-Einspielungen oder Dia-Shows sind heute Standard in der Internetwelt. Die einfachen Einfügebefehle <media>...</media> und <video>...</video> erlaubt es Ihnen, Audio-Files, Videos und Dia-Shows in Ihre Internetseiten einzubinden. Mit dem Befehl <media> fügen Sie Medien ein, welche in Ihrer Dokumentenverwaltung hochgeladen sind und mit <video> solche, die auf der Plattform eines Drittanbieters liegen, z.b. bei Youtube oder Google. Der <media> - Einfügebefehl 2 Audio-Files von der Homepage hören mit <media> Sie haben auf Ihrem Computer Media-Files mit Musik oder mit der Predigt des letzten Sonntags und möchten das auf der Homepage anbieten. Die Files haben das Format mp3 oder m4v. Der erste Schritt besteht darin, dass Sie die Files in Ihre Dokumentenverwaltung hochladen. Legen Sie vieleicht zuerst einen Audio-Ordner an, wo Sie alle Audio-Files im Internet ablegen. Das sieht dann z.b. so aus: Wie Sie von der Handhabung von Dokumenten her wissen, bekommt jedes File beim Hochladen einen Index. In der Abbildung oben z.b. eingekreist der Index 655 des Audio-Files "Play around". Diesen Index brauche ich im nächsten Schritt für die Einbindung des Musikstücks auf der Homepage. Nun öffnen Sie die Infoseite oder den Bericht oder die Veranstaltung, wo Sie das Musikstück oder die Predigt anbieten wollen. Geben Sie jetzt den Einfügebefehl <media></media> ein. Und dazwischen schreiben Sie den Index des angebotenen Audio-Files, in meinem Beispiel ist das 655: <media>655</media>.

3 In der Inhalt Zeile einer Infoseite sieht das dann z.b. so aus: Ja - das ist schon alles. Schliessen Sie nun das Eingabeformular, wo Sie das Audio-File platziert haben. Öffnen Sie dann die entsprechende Internetseite, um das Resultat anzuschauen. Bei mir sieht das so aus. Ein Klick auf startet die Musik. Am rechten Ende können Sie die Lautstärke regulieren. 3 Video-Files auf der Homepage ansehen mit <media> Sie haben auf Ihrem Computer ein Video-File mit einem kurzen Film, z.b. aus einem Jugend- Wochenende, den Sie auf der Homepage anbieten möchten. Dieses File hat das Format flv oder mp4 oder m4v. Der erste Schritt besteht darin, dass Sie die Files in Ihre Dokumentenverwaltung hochladen. Legen Sie vielleicht zuerst einen Video-Ordner an, wo Sie alle Video-Files im Internet ablegen. Das sieht dann z.b. so aus:

4 Wie Sie von der Handhabung von Dokumenten her wissen, bekommt jedes File beim Hochladen einen Index. In der Abbildung oben z.b. eingekreist der Index 649 des Videos "Weekend Ostern 2012". Diesen Index brauche ich im nächsten Schritt für die Einbindung des Videos auf der Homepage. Nun öffnen Sie die Infoseite oder den Bericht oder die Veranstaltung, wo Sie das Video anbieten wollen. Geben Sie jetzt den Einfügebefehl <media></media> ein. Und dazwischen schreiben Sie den Index des angebotenen Video-Files, in meinem Beispiel ist das 649: <media>649</media>. In der Inhalt Zeile einer Infoseite sieht das dann z.b. so aus: Ja - das ist schon alles. Schliessen Sie nun das Eingabeformular, wo Sie das Video-File platziert haben. Öffnen Sie dann die entsprechende Internetseite, um das Resultat anzuschauen. Bei mir sieht das so aus. Ein Klick auf startet das Video. Am rechten Ende kann man die Lautstärke regulieren.

5 Geniessen Sie den Film ;-) Der <video> - Einfügebefehl 4 Video von YouTube einbinden mit <video> Über eine URL (Internetadresse) können Sie direkt ein Video, das auf der Plattform Youtube liegt, auf Ihrer Internetseite abspielen. Sie gehen dabei wie folgt vor. 1. Video auf YouTube auswählen und ihr gewünschtes Anzeigeformat einstellen. 2. URL (Internetadresse) aus der Adresszeile des Browsers kopieren 3. Kopierte URL in den <video> - Einfügebefehl einsetzen. <video> Beachten Sie bitte, dass dieser Link je nach Video und Anzeigeformat unterschiedlich aussehen kann.

6 Auf Ihrer Internetseite sieht die Ausgabe dann in etwa so aus. 5 Video von vimeo einbinden mit <video> Video auf auswählen und die URL (Internetadresse) aus der Adresszeile des Browsers übernehmen. <video> 6 Dia-Show von picasaweb einbinden mit <video> Loggen Sie sich auf in Ihr Picasa-Konto ein. Wählen Sie das gewünschte Album aus. Beachten Sie, dass Sie die Dia-Show nur dann einbinden können, wenn das entsprechende Album als "Öffentlich", also mit anderen Kreisen geteilt wird. Sie finden nun auf der rechten Seite des Bildschirms in einem grauen Balken/Feld einen RSS-Link: Klicken Sie darauf. Nun kopieren Sie die URL (Internetadresse) des Albums aus der Adresszeile des Browsers.

7 Und fügen Sie diese Adresse in den Eifügebefehl <video></video> <video> /albumid/ ? alt=rss&kind=photo&hl=de</video> Das Resultat sollte die folgende Ansicht auf einer Internetseite sein: 7 Dia-Show von flickr einbinden mit <video> 7.1 Fotostream für alle Alben einbinden Wenn Sie aus Ihrem flickr-konto einen Fotostream einbinden möchten, der Ihre sämtlichen Fotos als Diashow anzeigt, dann wählen Sie unter dem Menü > Sie > Fotostream Kopieren Sie dann die Internetadresse heraus und setzen Sie diese zwischen die Video-Einfügebefehle: Das sieht zum Beispiel für den Fotostream von David Jufer wie folgt aus. <video>

8 Auf der Internetseite ist der Fotostream dann so sichtbar. 7.2 Ein bestimmtes Album einbinden Wenn Sie nur 1 Album als Diashow anzeigen möchten, dann wählen Sie in Ihrem flickr-konto das Menü > Sie > Ihre Alben. Klicken Sie auf das Album, das Sie auf der Homepage einbinden wollen. Kopieren Sie dann aus der Adresszeile des Browsers die Internetadresse des entsprechenden Albums. Das sieht dann z.b. für ein Album im Konto von David Jufer so aus: <video> Auf der Internetseite erscheint folgende Slide-Show. Nun wünsche ich Ihnen viel Spass beim medialen Aufrüsten Ihrer Homepage. kirchenweb.ch gmbh / / bn