Wählen Sie „Einfügen“ >„HTML“ > „Flash-Video“.
Zuletzt aktualisiert am
25. September 2023
Hier erfahren Sie, wie Sie in Dreamweaver Videos in Webseiten einbetten und FLV-Dateien einfügen.
Videos in Webseiten einbetten (HTML5)
HTML5 unterstützt Video- und Audio-Tags, über die Benutzer Video- und Audiodateien ohne externe Plug-Ins oder Player in einem Browser wiedergeben können. Dreamweaver unterstützt Codehinweise zum Hinzufügen von Video- und Audio-Tags.
Die Videos, die Sie in die Webseite einbetten, werden in der Live-Ansicht in einer Vorschau dargestellt.
Anmerkung
Sie können zwar jedes Video in Ihre Webseite einbetten, in der Live-Ansicht werden jedoch nicht immer alle Videos dargestellt. Die Audio- und Video-Tags werden in Dreamweaver durch das Plug-In Apple QuickTime unterstützt. Wenn das Plug-In Apple QuickTime unter Windows nicht installiert ist, werden die Medieninhalte in der Webseite nicht dargestellt.
Wie Sie HTML5-Videos einfügen, erfahren Sie unter HTML5-Videos in Dreamweaver einfügen.
FLV-Dateien einfügen
FLV-Dateien einfügen
Du kannst ganz einfach FLV-Videos zu deinen Webseiten hinzufügen, ohne das Flash Authoring Tool zu verwenden.Der Film muss als kodierte FLV-Datei vorliegen, bevor Sie beginnen können.
Dreamweaver fügt eine SWF-Komponente ein, die die FLV-Datei anzeigt. Wenn sie in einem Browser betrachtet wird, zeigt diese Komponente die ausgewählte FLV-Datei sowie eine Reihe von Wiedergabesteuerungen an.
Dreamweaver bietet dir die folgenden Optionen zur Bereitstellung von FLV-Video für deine Site-Besucher:
Progressiver Video-Download:
Lädt die FLV-Datei auf die Festplatte des Site-Besuchers herunter und spielt sie dann ab.Im Gegensatz zu herkömmlichen „Herunterladen und Abspielen"-Methoden der Video-Bereitstellung ermöglicht jedoch progressives Herunterladen, dass die Video-Datei bereits vor Abschluss des Downloads abgespielt wird.
Streaming-Video:
Gibt den Video-Inhalt gleich beim Empfang im Streaming-Verfahren wieder, d. h. auf der Webseite wird das Video nach einer kurzen Zwischenspeicherzeit, die eine unterbrechungsfreie Wiedergabe sicherstellt, abgespielt. Um Streaming-Video für Ihre Webseiten zu aktivieren, benötigen Sie jedoch Zugriff auf Adobe® Flash® Media Server.
Ein Film muss als kodierte FLV-Datei vorliegen, bevor Sie ihn in Dreamweaver verwenden können. Sie können Videodateien einfügen, die mit zwei Arten von Codecs (Komprimierungs-/Dekomprimierungsverfahren) erstellt wurden: Sorenson Squeeze und On2.
Wie bei herkömmlichen SWF-Dateien wird von Dreamweaver beim Einfügen einer FLV-Datei Code eingefügt, mit dem ermittelt wird, ob der Benutzer die korrekte Version von Flash Player verwendet, um das Video anzuzeigen. Wenn dies nicht der Fall ist, wird auf der Seite alternativer Inhalt angezeigt und der Benutzer wird aufgefordert, die neueste Version von Flash Player herunterzuladen.
Anmerkung
Zum Anzeigen von FLV-Dateien müssen die Benutzer Flash Player ab Version 8 auf ihrem Computer installiert haben. Wenn ein Benutzer nicht die erforderliche Version von Flash Player installiert hat, jedoch Flash Player ab Version 6.0 r65 installiert hat, wird im Browser anstelle des alternativen Inhalts die Express-Installation für Flash Player angezeigt. Wenn der Benutzer die Express-Installation nicht ausführt, wird auf der Seite der alternative Inhalt angezeigt.
Weitere Informationen zur Arbeit mit Videos finden Sie im Video Technology Center unter www.adobe.com/go/flv_devcenter.
FLV-Dateien einfügen
Im Dialogfeld „FLV einfügen" wählst du „Progressiver Download" oder „Streaming-Video" aus dem Popup-Menü „Videotyp" aus.
Vervollständige die restlichen Optionen im Dialogfeld und klicke auf
OK.
Anmerkung
Microsoft Internet Information Server (IIS) verarbeitet keine verschachtelten Objekt-Tags.Für ASP-Seiten verwendet Dreamweaver verschachtelten Object/Embed-Code anstelle von verschachteltem Object-Code beim Einfügen von SWF- oder FLV-Dateien.
Lege Optionen für Progressive Download Video fest
Das Dialogfeld FLV einfügen ermöglicht es dir, Optionen für die Progressive Download-Bereitstellung einer FLV-Datei festzulegen, die in eine Web-Seite eingefügt wird.
Wählen Sie „Einfügen“ > „HTML“ > „Flash-Video“ (oder klicken Sie im Bedienfeld „Einfügen“ in der Kategorie „HTML“ auf das Symbol „Flash-Video“).
Wähle im Dialogfeld FLV einfügen Progressive Download
Video aus dem Video-Typ-Menü aus.
Legen Sie die folgenden Optionen fest:
URL:
Gibt einen relativen oder absoluten Pfad zur FLV-Datei an. Um einen relativen Pfad anzugeben (zum Beispiel mypath/myvideo.flv), klicke auf den Button Durchsuchen, navigiere zur FLV-Datei und wähle sie aus. Um einen absoluten Pfad anzugeben, gib die URL (zum Beispiel http://www.example.com/myvideo.flv) der FLV-Datei ein.
Skin:
Legt das Aussehen der Video-Komponente fest. Eine Vorschau des ausgewählten Skins wird unter dem Popup-Menü Skin angezeigt.
Breite:
Die Breite der FLV-Datei in Pixel. Dreamweaver bestimmt die Breite der FLV-Datei, und Sie sehen, dass die Breite in diesem Feld automatisch angezeigt wird.
Höhe:
Die Höhe der FLV-Datei in Pixel. Dreamweaver optimiert automatisch die Höhe der FLV-Datei, und Sie sehen, dass die Höhe automatisch in diesem Feld angezeigt wird.
Anmerkung
„Gesamtgröße einschließlich Skin“ gibt die Breite und Höhe der FLV-Datei zuzüglich der Breite und Höhe der ausgewählten Skin an.
Beschränkung:
Behält das gleiche Seitenverhältnis zwischen der Breite und Höhe der Video-Komponente bei. Diese Option ist standardmäßig aktiviert.
Automatisch abspielen:
Legt fest, ob das Video abgespielt wird, wenn die Web-Seite geöffnet wird.
Automatisch zurückspulen:
Legt fest, ob die Wiedergabesteuerung zur Startposition zurückkehrt, nachdem die Videowiedergabe beendet ist.
Klicke auf OK, um das Dialogfeld zu schließen und die FLV-Datei
zu deiner Web-Seite hinzuzufügen.
Der Befehl FLV einfügen generiert eine Video-Player-SWF-Datei und eine Skin-SWF-Datei, die zur Anzeige deiner Videoinhalte auf einer Web-Seite verwendet werden. (Um die neuen Dateien zu sehen, musst du möglicherweise auf den Button Aktualisieren im Bedienfeld Dateien klicken.) Diese Dateien werden im gleichen Verzeichnis wie die HTML-Datei gespeichert, zu der du Videoinhalte hinzufügst. Wenn du die HTML-Seite mit der FLV-Datei hochlädst, lädt Dreamweaver diese Dateien als abhängige Dateien hoch (solange du im Dialogfeld Abhängige Dateien bereitstellen auf Ja klickst).
Optionen für Streaming-Video festlegen
Das Dialogfeld FLV einfügen ermöglicht es dir, Optionen für das Streaming-Video-Download einer FLV-Datei festzulegen, die in eine Web-Seite eingefügt wird.
Wählen Sie „Einfügen“ > „HTML“ > „Flash-Video“ (oder klicken Sie im Bedienfeld „Einfügen“ in der Kategorie „HTML“ auf das Symbol „Flash-Video“).
Wählen Sie im Popupmenü „Videotyp“ die Option „Streaming-Video“ aus.
Server-URI:
Gibt den Servernamen, Anwendungsnamen und Instanznamen im Format rtmp://www.example.com/app_name/instance_name an.
Streamname:
Gibt den Namen der FLV-Datei an, die du abspielen möchtest (z. B. meinvideo.flv). Die Erweiterung „.flv“ ist optional.
Skin:
Legt das Aussehen der Video-Komponente fest. Eine Vorschau des ausgewählten Skins wird unter dem Skin-Popup-Menü angezeigt.
Breite:
Die Breite der FLV-Datei in Pixel. Dreamweaver bestimmt die Breite der FLV-Datei und trägt sie automatisch in dieses Feld ein.
Höhe:
Die Höhe der FLV-Datei in Pixel. Dreamweaver bestimmt die Höhe der FLV-Datei in Pixel und trägt sie automatisch in dieses Feld ein.
Anmerkung
„Gesamtgröße einschließlich Skin“ gibt die Breite und Höhe der FLV-Datei zuzüglich der Breite und Höhe der ausgewählten Skin an.
Beschränkung:
Bewirkt, dass das Verhältnis zwischen Breite und Höhe der Videokomponente beibehalten wird. Diese Option ist standardmäßig aktiviert.
Live-Videoeinspielung:
Gibt an, ob das Videomaterial live eingespielt wird. Wenn diese Option aktiviert ist, wird in Flash Player eine Live-Videoeinspielung wiedergegeben, der von Flash® Media Server gestreamt wird. Der Name der Live-Videoeinspielung entspricht dem Namen, der im Textfeld „Streamname“ angegeben wurde.
Anmerkung
Um die Live-Videoeinspielung zu aktivieren, wählen Sie im Feld „Skin“ zunächst eine der Halo-Skinoptionen aus. Wenn Sie „Live-Videoeinspielung“ auswählen, wird auf der Skin der Komponente nur der Lautstärkeregler angezeigt, weil ein Live-Video nicht manipuliert werden kann. Außerdem ist die Einstellung der Optionen „Automatisch abspielen“ und „Automatisch zurückspulen“ wirkungslos.
Automatisch abspielen:
Gibt an, ob das Video abgespielt werden soll, wenn die Web-Seite geöffnet wird.
Automatisch zurückspulen:
Gibt an, ob die Wiedergabesteuerung zur Startposition zurückkehrt, nachdem das Video beendet ist.
Zwischenspeicherzeit:
Gibt die Zeit in Sekunden an, die für die Pufferung erforderlich ist, bevor das Video mit der Wiedergabe beginnt. Die standardmäßige Pufferzeit ist auf 0 eingestellt, damit das Video sofort nach dem Klicken auf die Wiedergabe-Schaltfläche abgespielt wird. (Wenn Automatische Wiedergabe ausgewählt ist, beginnt die Videowiedergabe, sobald eine Verbindung mit dem Server hergestellt ist.) Du möchtest möglicherweise eine Pufferzeit festlegen, wenn du Videos mit einer höheren Bitrate als die Verbindungsgeschwindigkeit des Site-Besuchers bereitstellst oder wenn Internet-Traffic Bandbreiten- oder Verbindungsprobleme verursachen könnte.Wenn du beispielsweise 15 Sekunden Video an die Web-Seite senden möchtest, bevor die Web-Seite mit der Wiedergabe des Videos beginnt, stellst du die Pufferzeit auf 15 ein.
Klicke auf OK, um das Dialogfeld zu schließen und die FLV-Datei zu deiner Web-Seite hinzuzufügen.
Der Befehl FLV einfügen generiert eine Video-Player-SWF-Datei und eine Skin-SWF-Datei, die verwendet werden, um dein Video auf einer Web- Seite anzuzeigen. Der Befehl generiert auch eine main.asc-Datei, die du auf deinen Flash Media Server hochladen musst. (Um die neuen Dateien zu sehen, musst du möglicherweise\nauf den Button „Aktualisieren" im Bedienfeld „Dateien" klicken.)Diese Dateien werden\nim selben Verzeichnis wie die HTML-Datei gespeichert, zu der du Videoinhalte hinzufügst.\nWenn du die HTML-Seite mit der FLV-Datei hochlädst, vergiss nicht,\nauch die SWF-Dateien auf deinen Webserver und die main.asc-Datei\nauf deinen Flash Media Server hochzuladen.
Anmerkung
Falls du bereits eine main.asc-Datei auf deinem Server hast, wende dich vor dem Hochladen der vom Befehl „FLV einfügen" generierten main.asc-Datei an deinen Serveradministrator.
Du kannst problemlos alle erforderlichen Mediendateien hochladen, indem du den Video-Komponenten-Platzhalter im Dreamweaver-Dokumentfenster auswählst und auf den Button „Medien hochladen" im Eigenschafteninspektor klickst (Fenster > Eigenschaften).Um eine Liste der erforderlichen Dateien zu sehen, klicke auf Erforderliche Dateien anzeigen.
Anmerkung
Der Button „Medien hochladen" lädt nicht die HTML-Datei hoch, die die Videoinhalte enthält.
Flash Player-Downloadinformationen bearbeiten
Beim Einfügen einer FLV-Datei in eine Seite fügt Dreamweaver Code ein, mit dem ermittelt wird, ob der Benutzer die korrekte Version von Flash Player verwendet. Wenn dies nicht der Fall ist, wird alternativer Inhalt angezeigt und der Benutzer aufgefordert, die neueste Version herunterzuladen. Sie können den alternativen Inhalt jederzeit ändern.
Dieses Verfahren wird auch bei SWF-Dateien angewendet.
Anmerkung
Wenn ein Benutzer nicht die erforderliche Version, jedoch Flash Player ab Version 6.0 r65 verwendet, wird im Browser die Express-Installation für Flash Player angezeigt. Wenn der Benutzer die Express-Installation nicht ausführt, wird auf der Seite der alternative Inhalt angezeigt.
Wähle in der Design-Ansicht des Dokumentfensters die SWF-Datei oder FLV-Datei aus.
Klicken Sie bei der SWF- oder FLV-Datei auf das Symbol mit dem Auge.
Anmerkung
Du kannst auch Strg + ] drücken, um zur alternativen Inhaltsansicht zu wechseln.Um zur SWF/FLV-Ansicht zurückzukehren, drücke Strg + [ bis der gesamte alternative Inhalt ausgewählt ist. Drücke dann Strg + [ erneut.
Bearbeite den Inhalt genauso, wie du jeden anderen Inhalt
in Dreamweaver bearbeiten würdest.
Anmerkung
Du kannst keine SWF-Dateien oder FLV-Dateien als alternativen Inhalt hinzufügen.
Klicke erneut auf das Augensymbol, um zur SWF- oder FLV-
Dateiansicht zurückzukehren.
Fehlerbehebung für FLV-Dateien
Dieser Abschnitt beschreibt einige der häufigsten Ursachen für Probleme mit FLV-Dateien.
Anzeigeprobleme durch fehlende zugehörige Dateien
Der von Dreamweaver CS4 und späteren Versionen generierte Code basiert auf vier abhängigen Dateien, die sich von der FLV-Datei selbst unterscheiden:
swfobject_modified.js
expressInstall.swf
FLVPlayer_Progressive.swf
Skin-Datei (z. B. Clear_Skin_1.swf)
Beachte, dass es zwei weitere abhängige Dateien für Dreamweaver CS4 und später gibt, verglichen mit Dreamweaver CS3.
Die ersten beiden dieser Dateien (swfobject_modified.js und expressInstall.swf) werden in einem Ordner namens Scripts installiert, den Dreamweaver im Stammverzeichnis deines Bereichs erstellt, falls er nicht bereits vorhanden ist.
Die zweiten beiden Dateien (FLVPlayer_Progressive.swf und die Skin-Datei) werden im selben Ordner wie die Seite installiert, in die das FLV eingebettet ist. Die Skin-Datei enthält die Steuerungen für das FLV, und ihr Name hängt vom Skin ab, der in den in der Dreamweaver-Hilfe beschriebenen Optionen gewählt wurde. Wenn du beispielsweise Clear Skin wählst, heißt die Datei Clear_Skin_1.swf.
Alle vier abhängigen Dateien MÜSSEN auf deinen Remote-Server hochgeladen werden, damit das FLV korrekt angezeigt wird.
Das Vergessen, diese Dateien hochzuladen, ist die häufigste Ursache dafür, dass FLV-Dateien nicht korrekt auf einer Web-Seite funktionieren. Wenn eine der Dateien fehlt, siehst du möglicherweise eine „weiße Box" auf der Seite.
Um sicherzustellen, dass du alle abhängigen Dateien hochgeladen hast, verwende das Dreamweaver-Bedienfeld „Dateien", um die Seite hochzuladen, in der die FLV-Datei erscheint.Wenn du die Seite hochlädst, fragt Dreamweaver dich, ob du abhängige Dateien hochladen möchtest (es sei denn, du hast diese Option deaktiviert). Klicken Sie auf „Ja“, um die abhängigen Dateien hochzuladen.
Anzeigeprobleme bei der lokalen Vorschau von Seiten
Aufgrund von Sicherheitsupdates in Dreamweaver CS4 kannst du den Befehl „Testen auf iOS/Android im Browser" nicht verwenden, um eine Seite mit einer eingebetteten FLV-Datei zu testen, es sei denn, du definierst einen lokalen Testserver in deiner Dreamweaver-Bereichsdefinition und verwendest den Testserver für die Vorschau der Seite.
Normalerweise benötigst du einen Testserver nur, wenn du Seiten mit ASP, ColdFusion oder PHP entwickelst (siehe Richte deinen Computer für die Anwendungsentwicklung ein). Wenn du Websites erstellst, die nur HTML verwenden und keinen Testserver definiert hast, führt das Drücken von F12 (Windows) Opt+F12 (Macintosh) zu einem Durcheinander von Skin-Steuerelementen auf dem Bildschirm. Die Umgehungslösung besteht darin, entweder den Testserver zu definieren und den Testserver zu verwenden, um deine Seite in der Vorschau anzuzeigen, oder deine Dateien auf einen Remote-Server hochzuladen und sie dort anzuzeigen.
Anmerkung
Es ist möglich, dass Sicherheitseinstellungen auch dafür verantwortlich sein können, dass lokale FLV-Inhalte nicht in der Vorschau angezeigt werden können, aber Adobe konnte dies nicht bestätigen.Sie können versuchen, Ihre Sicherheitseinstellungen zu ändern, um zu sehen, ob das hilft. Weitere Informationen zum Ändern der Sicherheitseinstellungen finden Sie in der TechNote 117502.
Andere mögliche Ursachen für Probleme mit FLV-Dateien
Wenn Sie mit der lokalen Vorschau Probleme haben, stellen Sie sicher, dass unter „Bearbeiten“ > „Voreinstellungen“ > „Echtzeitvorschau“ die Option „Vorschau mit temporärer Datei“ deaktiviert ist.
Stellen Sie sicher, dass das neueste FlashPlayer-Plugin installiert ist.
Vermeiden Sie nach Möglichkeit, Dateien und Ordner außerhalb von Dreamweaver zu verschieben. Wenn Sie Dateien und Ordner außerhalb von Dreamweaver verschieben, ist nicht mehr gewährleistet, dass für FLV-abhängige Dateien die korrekten Pfade eingetragen sind.
Sie können die problematische FLV-Datei vorübergehend durch eine andere ersetzen, von der Sie wissen, dass sie funktioniert. Wenn die ersetzte FLV-Datei korrekt angezeigt wird, dann liegt das Problem an der ursprünglichen FLV-Datei und nicht am Browser oder am Computer.
FLV-Komponenten bearbeiten oder löschen
Ändern Sie die Einstellungen für Videos auf Ihrer Webseite, indem Sie im Dreamweaver-Dokumentfenster den Platzhalter für die Videokomponente auswählen und die Änderungen im Eigenschafteninspektor vornehmen. Eine andere Möglichkeit ist, die Videokomponente zu löschen und sie wieder einzufügen, indem Sie „Einfügen“ > „HTML“ > „Flash-Video“ wählen.
FLV-Komponenten bearbeiten
Wähle den Platzhalter der Videokomponente im Dreamweaver-Dokumentfenster aus, indem du auf das FLV-Symbol in der Mitte des Platzhalters klickst.
Öffne den Eigenschafteninspektor (Fenster > Eigenschaften) und nimm deine Änderungen vor.
Anmerkung
Du kannst Videotypen nicht über den Eigenschafteninspektor ändern (zum Beispiel von progressivem Download zu Streaming).Um den Videotyp zu ändern, lösche die FLV-Komponente und füge sie erneut ein, indem du Einfügen > Medien > FLV auswählst.
FLV-Komponenten löschen
Wähle den FLV-Komponenten-Platzhalter
im Dokumentfenster von Adobe Dreamweaver aus und drücke
Entf.
Video hinzufügen (andere Formate)
Wie Sie Videos hinzufügen, die keine .flv-Dateien sind, erfahren Sie unter Videos hinzufügen, die keine FLV-Videos sind.
Sie sollten ebenfalls wissen, wie Sie Plug-In-Inhalte in Dreamweaver einfügen, damit sich .mp3-Dateien oder QuickTime-Videos auf Ihrer Dreamweaver-Website abspielen lassen.
Ähnliche Themen
Erstellen ansprechender Websites in Dreamweaver
Entwirf, code und verwalte dynamische Websites mit einem leistungsstarken All-in-one-Tool.
