Share
Das Erstellen einer vollständig auf Flash basierenden Website ist zwar aus verschiedenen Gründen keine gute Idee, bedeutet jedoch nicht, dass Sie Flash überhaupt nicht verwenden dürfen. Ich denke gerne an Flash als Gewürz. Wenn Sie hier und dort Gewürze platzieren, kann dies den Geschmack Ihrer Website verbessern, um sie für Ihre Besucher angenehmer und interaktiver zu gestalten. Wie wir alle wissen, kann das Einbringen von zu vielen Gewürzen in unser Gericht natürlich Probleme verursachen. Flash sollte also in Maßen verwendet werden. Mal sehen, wie das geht.
Das Ziel jeder Website ist Inhalt, den Menschen lesen und genießen können, und der auch von Suchmaschinen und Robotern verstanden wird. So etwas Flash ist fast immer in Ordnung. Aber zu viel Flash ist für Suchmaschinen relativ zu HTML weniger nützlich. Flash-Medien können an einer beliebigen Stelle in einem WordPress-Design eingefügt werden: in der Kopfzeile, in einem Beitrag oder auf einer Seite, in einer Seitenleiste oder in der Fußzeile. Es liegt ganz bei Ihnen und Ihren persönlichen Vorlieben und Bedürfnissen. Das wirklich Wichtige ist hier nicht, wo Sie es verwenden, sondern wie Sie es verwenden werden. Und das ist das Ziel dieses Tutorials. Zeigen Sie verschiedene Möglichkeiten zum Einbetten von Flash-Medien in Ihre mit WordPress betriebenen Websites und wie diese Methoden ordnungsgemäß ausgeführt werden. Beginnen wir mit dem wesentlichsten, das eine Basis für die anderen ist.
SWFObject ist eine JavaScript-Bibliothek, die zwei optimierte Methoden zum Einbetten von SWF-Dateien in Webseiten bietet - ein auf Markup basierender Ansatz und eine auf JavaScript basierende Methode. Es verwendet unauffälliges JavaScript, um Flash Player zu erkennen und beschädigte SWF-Inhalte zu vermeiden, und soll das Einbetten von SWF-Dateien so einfach wie möglich machen. Es unterstützt die Verwendung alternativer Inhalte, um Personen, die ohne Plugins im Internet surfen, Inhalte anzuzeigen, Suchmaschinen bei der Indexierung Ihrer Inhalte zu helfen oder Besucher auf die Flash Player-Downloadseite zu verweisen. All dies wird von einer kleinen JavaScript-Datei unterstützt.
SWFObject ist die beliebteste und effizienteste Flash-Einbettungsmethode, die derzeit verfügbar ist. Es wird häufig von namhaften Websites wie YouTube, Microsoft Windows und Skype verwendet.
Da Sie herausfinden müssen, welcher Markup- und JavaScript-Code ein langwieriger Job ist, stellt Ihnen SWFObject einen zusätzlichen SWFObject-Generator zur Verfügung, der diese Arbeit für Sie erledigt. Die neuesten Versionen von SWFObject und SWFObject Generator finden Sie im Google Code. Laden Sie das SWFObject und die HTML-Version des SWFObject Generator herunter. Der Hauptunterschied zwischen der HTML- und der AIR-Version besteht darin, dass die letzte Version eine Funktion zum Kopieren in die Zwischenablage hat und Ihre HTML-Seite auf Ihrer Festplatte speichern kann.
Wenn Sie den Inhalt von extrahieren swfobject_2_2.zip Sie erhalten einen Ordner namens swfobject welches die folgenden Dateien enthält:
Sie können auch die SWF-Datei herunterladen, die wir im restlichen Tutorial von Free Flash Animations verwenden werden. Benennen Sie es in um nosmoke.swf kurz.
OK. Alles ist bereit. Lass uns weitermachen.
Nun müssen Sie alle benötigten Dateien auf Ihren Server hochladen. Diese sind swfobject.js, expressInstall.swf und nosmoke.swf. Platzieren Sie sie in Ihrem aktiven Themenordner. In diesem Fall ist dies das zwanzig elf Themenordner. Wenn du viele hast .swf Dateien können Sie in einem Unterordner ablegen.
Um den benötigten Code zu erstellen und in WordPress einzufügen, gehen Sie folgendermaßen vor:
Accentsconagua
tag im body-Abschnitt des Codes. Alles von zu wird ausgewählt. Kopiere es.
- Klicken Sie in der Seitenleiste Ihres WordPress-Dashboards auf den Pfeil rechts neben Erscheinungsbild. Klicken Sie dann auf Editor.
- Auf der rechten Seite des Bildschirms haben Sie jetzt eine Liste aller Vorlagen, die sich im Stammverzeichnis des Designordners befinden. Klicken Sie auf den Titel des gewünschten .php Datei (in diesem Fall footer.php). Dies lädt es in den Theme-Editor.
- Fügen Sie den aus dem Codegenerator kopierten Code in die entsprechende Vorlagendatei ein. In diesem Beispiel direkt über dem
- Wählen Sie für den Kopfinhalt Folgendes aus und kopieren Sie Folgendes:
- Zurück in WordPress, öffnen Sie sich header.php Klicken Sie auf Darstellung> Editor> header.php. Fügen Sie den ausgewählten Text in den Kopfbereich über ein
Der Codegenerator erstellt den Code für Sie basierend auf den von Ihnen getroffenen Entscheidungen. Es generiert den Code innerhalb der Grundstruktur einer HTML-Seite. Der generierte Code entspricht den Webstandards und unterstützt die Aufnahme alternativer Inhalte. Die JavaScript-Elemente in der Ein Tag wird erstellt, das die Objekt- und verschachtelten Objektinformationen / -methode enthält, die welche definiert .swf gespielt werden soll, die Breite und Höhe davon und welche alternativen Inhalte angezeigt werden, wenn die entsprechende Flash Player-Version nicht gefunden wird. Beachten Sie, dass spezielle Codierungen verwendet werden, um die Anforderungen von Internet Explorer zu berücksichtigen, beispielsweise: Jetzt nosmoke.swf Animation wird auf jeder Seite unterhalb der Fußzeile angezeigt. Natürlich ist dies ein Dummy-Beispiel, aber ich verwende es nur zu Präsentationszwecken, weil es schneller und einfacher möglich ist. Natürlich müssen Sie einige Stilregeln hinzufügen, um ein besseres Erscheinungsbild zu erhalten. Sie werden sehen, wie kurz.
Schritt 4 SWFObject-Konfiguration erklärt
Statisches vs. dynamisches Publishing
Static Publishing verwendet Markup, um sowohl SWF-Inhalte als auch alternative Inhalte einzubetten, und verwendet unauffälliges JavaScript, um eine Reihe von Problemen zu lösen, die nicht allein mit Markup gelöst werden können. Es fördert die eigentliche Erstellung von Standards-konformen Markups und wird daher insbesondere Entwickler von Web-Standards ansprechen. Dieser Mechanismus zum Einbetten von Flash-Inhalten ist nicht von einer Skriptsprache abhängig, sodass Ihre Flash-Inhalte eine wesentlich größere Zielgruppe erreichen können. Wenn Sie das Flash-Plug-In installiert haben, JavaScript jedoch deaktiviert haben oder einen Browser verwenden, der JavaScript nicht unterstützt, können Sie Ihren Flash-Inhalt trotzdem anzeigen.
Dynamic Publishing verwendet Markup nur zum Definieren alternativer Inhalte und verwendet unauffälliges JavaScript, um dies durch die SWF-Datei zu ersetzen, wenn die minimale Flash Player-Version installiert ist und ausreichende JavaScript-Unterstützung verfügbar ist. Dynamisches Publishing ist weniger ausführlich als statisches Publishing und lässt sich sehr gut in Skriptanwendungen integrieren. Wenn Sie das Flash-Plug-In installiert haben, JavaScript jedoch deaktiviert haben oder einen Browser verwenden, der kein JavaScript unterstützt, wird anstelle des eingebetteten Flash-Inhalts der alternative Inhalt angezeigt.
Sie müssen entscheiden, welche Lösung für Sie die beste Lösung ist, abhängig von Ihren Zielen und Bedürfnissen.
Verwenden der Adobe Express-Installation
Adobe Express Install ist ein in Flash Player integrierter Mechanismus, mit dem Sie die neueste Version des Flash-Plug-Ins direkt herunterladen können, ohne zur Adobe-Website wechseln zu müssen. Die Schnellinstallation ist eine optionale Funktion für Webautoren und zeigt ein standardisiertes Download-Dialogfeld an, wenn ein Besucher bereits Flash Player 6.0.65 oder höher auf Win- oder Mac-Plattformen installiert hat. Eine spätere Plug-In-Version ist jedoch erforderlich. Die Express-Installation verwendet ein Popup-Bestätigungsfenster und ist daher eine optionale Funktion, die von Web-Autoren aktiviert werden kann. Wenn Sie auf Ja klicken, öffnet die Schnellinstallation ein Dialogfeld zum Herunterladen mit der Aufforderung, alle Browserfenster zu schließen. Nach der Installation von Flash Player wird das Browserfenster erneut geöffnet und Sie werden zu der Seite weitergeleitet, auf der die Express-Installation gestartet wurde. Wenn Sie auf Nein klicken, wird SWFObject zum alternativen Inhalt zurückgesetzt.
Sie können die Express-Installation aktivieren, indem Sie das Kontrollkästchen für die Adobe Express-Installation aktivieren und den Pfad auf den Pfad einstellen expressInstall.swf Datei, falls erforderlich. Um zu testen, ob diese Funktion funktioniert und in Aktion zu sehen, machen Sie diesen kleinen Trick: Ändern Sie die erforderliche Flash-Version in eine Version, die größer ist als die aktuelle Flash Player-Version (z. B. 14.0.0). Und Sie erhalten dieses Ergebnis:
Die Meldung sagt Ihnen, dass der Inhalt Adobe Flash Player 11.1 erfordert, da dies tatsächlich die aktuellste Version des Plugins ist (derzeit) und Version 14.0 noch nicht vorhanden ist.
Schritt 5 SWFObject-Definition erklärt
Im SWFObject Generator finden Sie eine Reihe zusätzlicher Attribute und Parameter, die Ihnen zur Verfügung stehen. Sie sind standardmäßig ausgeblendet. Um auf diese zuzugreifen, klicken Sie einfach unten im SWF-Definitionsbereich auf "mehr". Danach sollten Sie Folgendes sehen:
Abhängig von Ihren hier getroffenen Entscheidungen wird sich Ihr Flash-Inhalt verhalten und anders aussehen. Bewegen Sie den Mauszeiger über den Namen, um eine Beschreibung der Funktion eines bestimmten Attributs oder Parameters zu erhalten.
Das Namensattribut ist hilfreich, wenn Sie mit einer Skriptsprache auf Ihren Flash-Film verweisen müssen. Wie bereits gesagt, müssen Sie möglicherweise Ihren Flash-Inhalten ein weiteres Styling hinzufügen. Fügen Sie dazu einfach einen Wert für das Klassenattribut hinzu, beispielsweise "flashmovie". Diese Klasse wird dem Objekt-Tag-Element in Ihrem generierten Code hinzugefügt. Nun müssen Sie nur noch die folgende Stilregel in Ihr Design-Stylesheet einfügen:
object.flashmovie // Ihr CSS-Code hier
Schritt 6 Verwenden des Embed SWF Online Generator
Es gibt einen anderen einfachen Weg, um den erforderlichen Erkennungscode zu erhalten - mithilfe eines Online-Generators. Eine gute ist bei embed-swf.org zu finden. Es basiert auf SWFObject HTML und JavaScript Generator. Um zu verfahren, folgen Sie diesen Schritten:
- Öffnen Sie den Konfigurator. Die Benutzeroberfläche ist in fünf Registerkarten unterteilt.
- Geben Sie die gewünschten Parameter in jede Registerkarte ein
- Klicken Sie auf die Registerkarte Export. Hier können Sie eine Exportvorlage auswählen. Wenn Sie eine eigene HTML-Vorlage verwenden möchten, wählen Sie Benutzerdefiniert. Um zu erfahren, wie man eine erstellt, lesen Sie die Dokumentation.
- Klicken Sie nun auf HTML-Code anzeigen. Ihr HTML-Code wird angezeigt. Klicken Sie auf Download, um die Datei auf Ihrer Festplatte zu speichern.
Bei Bedarf können Sie die Standardeinstellungen jederzeit wiederherstellen, indem Sie auf den Link in der oberen linken Ecke klicken. Sie haben auch die Möglichkeit, gespeicherte Einstellungen zur einfachen Wiederverwendung zu exportieren / importieren.
Sie brauchen sich nicht um das zu kümmern swfobject.js Datei. Behalten Sie einfach die Standardoption für das SWFObject bei, das das verwendet swfobject.js Von Google gehostete Datei.
Schritt 7 Kimili Flash Embed verwenden
Laut seiner Website ist Kimili Flash Embed:
… Ein Plugin für beliebte Open Source-Blogging-Systeme, mit dem Sie Flash-Filme problemlos auf Ihrer Website platzieren können. Basierend auf dem SWFObject-JavaScript-Code ist er standardkonform, suchmaschinenfreundlich, hochflexibel und voll funktionsfähig sowie einfach zu bedienen.
Die Installation des Plugins ist einfach:
- Erweitern Sie in Ihrem Dashboard das Menü Plugins und klicken Sie auf Neu hinzufügen
- In der Suchleiste geben Sie "Flash einbetten" ein.
- Wenn Sie Kimili Flash Embed sehen, klicken Sie auf Installieren
- Nach der Installation gehen Sie zu Plugins und aktivieren Sie es oder klicken Sie einfach auf Jetzt aktivieren
Führen Sie folgende Schritte aus, um Flash-Inhalte in Ihren Posts oder Seiten hinzuzufügen:
- Erstellen Sie einen neuen Beitrag / eine neue Seite oder öffnen Sie eine vorhandene
- Wechseln Sie zur HTML-Ansicht
- Um nun eine Flash-Animation hinzuzufügen, verwenden Sie den folgenden Kurzcode, der Pfad, Y- und X-Parameter durch den jeweiligen Pfad, die Höhe und die Breite Ihres SWF ersetzt:
[kml_flashembed movie = "/ path / to / your / movie.swf" /]
- Der Filmparameter ist der einzige, der benötigt wird - Höhe und Breite sind optional. Obwohl es am effizientesten ist, Ihre Größe zu bestimmen .swf Während des Exports ändern sich die Parameter für Höhe und Breite a .swf Datei. Wenn Sie dies tun, sollten Sie die Zahlen im Skalierungsverhältnis halten, um Verzerrungen zu vermeiden.
Der Kimili Flash Embed Tag Generator ist eine modifizierte Version des SWFObject 2 HTML- und JavaScript-Generators und ist eng in WordPress integriert. Dadurch ist es sehr einfach, KFE-Tags mit der richtigen Formatierung zu erstellen.
Flash über den KFE-Tag-Generator hinzufügen:
- Um den Tag Generator zu starten, eine assistentenähnliche Oberfläche, die Sie beim Erstellen des erforderlichen KFE-Tags unterstützt, klicken Sie auf die Schaltfläche mit dem Flash Player-Symbol. (Sie müssen in den visuellen Modus wechseln, um es zu sehen.)
- Ein Fenster ähnlich dem SWFObject Generator wird angezeigt
- Sie müssen nur die erforderlichen Parameter auffüllen und dann auf Generieren klicken
Sie können die Standardeinstellungen im Admin-Menü festlegen. Wählen Sie Einstellungen> Kimili Flash Embed.
Die Optionen hier sind ziemlich gleich, mit Ausnahme von JavaScript unten. Sie können die erste Option in "Nein" ändern, wenn Sie dies bereits getan haben swfobject.js in Ihrem Code an anderer Stelle referenziert werden. Wenn Sie Kimili Flash Embed verwenden, um eine Referenz zu erstellen swfobject.js Wenn Sie "Ja" auswählen, haben Sie zwei Optionen, von denen aus Sie auf die Datei verweisen können: Google Ajax Library oder Internal. Klicken Sie auf "Was ist das?" um zu sehen, was die Unterschiede sind. Wenn Sie fertig sind, klicken Sie auf Update-Optionen.
Schritt 8 Bereitstellen von alternativen Inhalten
In diesen Tagen haben die führenden Suchmaschinenanbieter wie Google und Yahoo! Sie können Textinhalte und Links in SWF-Dateien indizieren, während Sie durch den Status einer Anwendung navigieren, als ob sie echte Besucher wären. Warum müssen Sie dann noch alternative Inhalte verwenden, um Suchmaschinen bei der Indexierung Ihrer Inhalte zu helfen? Dies hat mehrere Gründe.
- Erstens ist nicht jede Suchmaschine in der Lage, Flash-Inhalte zu indizieren.
- Zweitens, da eine SWF-Datei in der Regel mit Multimedia-Inhalten gefüllt ist, bleibt noch viel Inhalt für Suchmaschinen unsichtbar. Sie müssen weiterhin alternative Inhalte verwenden, um Personen mit geringerer Technologieunterstützung beschreibendes Material anzuzeigen und den Besuchern zu helfen, die Flash Player-Downloadseite zu finden.
- Und schließlich werden Suchmaschinen wahrscheinlich sowohl Flash-Inhalte als auch alternative Inhalte indizieren. Aus der Sicht eines Webautors gilt zwar das Duplizieren von Inhalten als bewährte Methode, da Sie damit Webinhalte erstellen können, die für eine möglichst große Zielgruppe zugänglich sind. Für Suchmaschinenanbieter bietet dies jedoch einige schwierige Herausforderungen, z. B. wie zu entscheiden, welche Ergebnisse in ihren Suchmaschinenlisten angezeigt werden. Wenn Sie suchmaschinenfreundliche Inhalte erstellen, sollten Sie diese Dualität immer im Auge behalten. Stellen Sie sicher, dass Ihr HTML-Inhalt eine echte Spiegelung Ihres Flash-Inhalts ist, und lassen Sie eine Suchmaschine entscheiden, welcher Inhalt am besten als Suchergebnis angezeigt werden kann.
Sie können beispielsweise Folgendes tun, um bessere alternative Inhalte zu erstellen:
- Verwenden Sie genau dieselbe Kopie und Links wie in Ihrem Flash-Inhalt
- Fügen Sie Bilder und Textbeschreibungen zum Flash-Inhalt hinzu
- Fügen Sie eine Kopie hinzu, um zu erklären, wo Flash Player heruntergeladen werden kann
- Fügen Sie CSS hinzu, um Ihren HTML-Code zu gestalten und zu positionieren, um die visuelle Identität der Webseite zu erhalten.
Standardmäßig veröffentlicht SWFObject 2 Generator die folgenden alternativen Inhalte:
Daraufhin erhalten Sie eine Schaltfläche "Get Adobe Flash Player", mit der Besucher darauf hingewiesen werden, wo sie das Plugin herunterladen können. Um dies zu testen, müssen Sie Ihr Flash Player-Plugin deaktivieren. In Firefox gehen Sie zu Add-ons> Plugins. Suchen Sie Shockwave Flash und klicken Sie auf die Schaltfläche "Deaktivieren". Wenn Sie nun die Seite neu laden, sollten Sie Folgendes sehen:
Sie können den Standardcode durch diesen Code ersetzen:
Wenn Besucher nun die Seite ohne Flash-Plugins durchsuchen, sehen sie ein Bild anstelle der eigentlichen Animation:
Suchmaschinen und Besucher, die im Webbrowser oder mit deaktivierten Bildern im Internet surfen, sehen den Inhalt wie in diesem Screenshot:
Wenn Sie ein Banner mit mehreren Status haben, können Sie für jedes davon ein Bild erfassen und diese Bilder als alternativen Inhalt einfügen. Es kann so aussehen:
Für eine Animation oder einen Videoinhalt können Sie dasselbe Prinzip verwenden. Sie können mehrere Schlüsselbilder aufnehmen und diese verwenden, um den Inhalt Ihrer Animation / Ihres Videos zu beschreiben. Hier ist das Basisschema:
Beschreibung von Bild 1- Beschreibung von Bild 2
- Beschreibung von Bild 3
Personen ohne das Flash-Plug-In sehen eine Bildsequenz mit Beschreibungen, und Personen, die mit einem Textbrowser oder bei deaktivierten Bildern im Internet surfen, erhalten eine Reihe von Beschreibungen.
Eine andere Möglichkeit besteht darin, ein Video-Miniaturbild sowie eine Textbeschreibung des Films hinzuzufügen.
Sie können Ihrem alternativen Inhalt auch ein paar Zeilen Kopie hinzufügen, um anzugeben, dass die beabsichtigte interaktive oder audiovisuelle Benutzererfahrung die neueste Version von Flash Player mit einem Link zur Downloadseite erfordert.
Sie können auch zusätzliche Stilregeln erstellen, um sicherzustellen, dass die visuelle Identität oder das Layout einer Webseite erhalten bleibt. Stellen Sie sich alternative Inhalte als eine Möglichkeit vor, mit Ihrer Zielgruppe zu kommunizieren, auch wenn diese nicht die gewünschte Technologieunterstützung bietet.
Fazit
Das ist es. Jetzt wissen Sie, wie Sie Flash-Inhalte einfach und ordnungsgemäß in Ihre WordPress-basierte Website einbetten. Der Inhalt kann alles sein - Animation, Anwendung, Film, Spiel und was immer Sie wollen und müssen. Mit etwas Phantasie können Sie Ihre Website einerseits wirklich cool und andererseits noch nützlich machen.
Beschreibung von Bild 1