Hilfe ! Wie Flash Film in HTML einbinden?

[S.w.a.p]

Hallo zusammen,

habe leider ein großes Anfängerproblem. Und zwar ich möchte auf dieser Seite den ersten Film auf der rechten Spalte in meine HTML-Seite einbinden.

http://www.next-ad.com/hp/PublisherFlyer/anzeigen_banner.php

Wie funktioniert das denn? Wenn ich das Paket herunterlade habe ich 4 SWF-Dateien. Und wie kann ich steuern in welchem bereich der Film nacher angezeigt werden soll?

Bitte um Hilfe, bin totaler Anfänger.

[mali]

Das einfachste was Du machen kannst: Kopiere Dir den betreffenden Quellcode aus der Seite raus und pass die Pfade an.  Der Flashfilm taucht bei Dir auf der Seite genau dort auf, wo Du ihn in die Seitenstruktur eingepasst hast.

[S.w.a.p]

Hi, hört sich einfach an, nur fehlen mir die Grundkenntnisse.

Welche Pfade muss ich denn anpassen, und wo fängt der Quellcode betreffend des Films an und wo hört er auf ?

Der Film auf der Seite ist ja auch verkleinert. Beim runterladen des pakets habe ich ja 4 SWF-Dateien.

[mali]

Der Quellcode (für den rechten oberen Film) ist jener:

Code [Auswählen] Erweitern


<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="121" height="100">
                <param name="movie" value="flash/300x250_hp_colorsphere_mpu.swf" />
                <param name="quality" value="high" />

                <embed src="flash/300x250_hp_colorsphere_mpu.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="121" height="100"></embed>
              </object>


Der Code erwartet, das der Flash-Film in einem Ordner namens "flash/" liegt. Das mußt Du an Deine lokalen Begebenheiten anpassen. Oder Du richtest auch einen Ordner diesen Namens auf dem Webserver ein ;-)

[S.w.a.p]

Ok danke. Muss der Ordner auf dem Webserver nur flash/ heißen oder noch Unterverzeichnisse haben? Ist egal wo der ordner liegt oder muss er in das Verzeichnis wo auch die betreffende html-Seite ist?
Ich habe mittlerweile kapiert, dass der Film in verschiedenen Größen donwloadbar ist.

Nehmen wir an ich möchte die Datei größe2.swf verwenden. Der Film soll in meine vorhandene Seite index.html eingebunden werden. Wie würde dann der Befehlstext lauten? Geht das auch einfacher mit NVU?

Ich wäre dir unendlich dankbar, wenn du die 1-2 Schritte noch ausführlich für mich absoluten Anfänger erklären könntest :)
Wie ich mit FTP programmen arbeite ist kein Problem.

EDIT: also wenn ich den von dir angegebenen Quellcode in NVU reinkopiere, erscheint in der Vorschau sowie nach den abspeichern kein Film...?

[mali]

Ok danke. Muss der Ordner auf dem Webserver nur flash/ heißen oder noch Unterverzeichnisse haben?

Ganz wie Du möchtest ;) Die entscheidende Stelle im Quellcode ist:

flash/300x250_hp_colorsphere_mpu.swf

"flash" heisst der Ordner und "300x250_hp_colorsphere_mpu.swf" die Datei. Benennst Du Ordner und/oder Datei um, mußt Du eben auch die Stelle im Quellcode entsprechend ändern.

Ist egal wo der ordner liegt oder muss er in das Verzeichnis wo auch die betreffende html-Seite ist?

Je nach Konfig und Webserver. Im Moment erwartet der Quellcode, das vom Verzeichnis der aufrufenden Webseite ein Unterordner "flash" vorhanden ist, in dem der Film namens "300x250_hp_colorsphere_mpu.swf" liegt.

Nehmen wir an ich möchte die Datei größe2.swf verwenden. Der Film soll in meine vorhandene Seite index.html eingebunden werden. Wie würde dann der Befehlstext lauten? Geht das auch einfacher mit NVU?

Ich habe keinen Schimmer, was NVU ist :-)

[S.w.a.p]

NVU ist ein WEB-Editor :)

Also ich habe jetzt mal eine leere Seite genommen, und folgenden Code für die heruntergeladene sfw-Datei erstellt. Die Seite habe ich hochgeladen, du findest sie hier:

http://www.meister-repro.de/index3.html

Es erscheint aber nur so ein mickriges Teil, obwohl ich im selben Verzeichnis, in dem die index3 liegt einen Ordner flash erstellt habe und der Film darin liegt (alles online).

Was ist nun noch falsch ? Es sieht nämlich irgendwie komisch aus :)

[mali]

[...]
Was ist nun noch falsch ? Es sieht nämlich irgendwie komisch aus :)

Nicht wenn Du es direkt aufrufst:
http://www.meister-repro.de/flash/exploding_bouquet_120x600_20070412.swf

Im Code kann man die Größe einstellen. Im Moment steht dort height="100" width="121".

[S.w.a.p]

Ok, das mit der Größe ändern klappt nun auch :)

Jetzt noch die heiße Frage. Wie kann ich beeinflussen wo der Film jetzt genau angezeigt wird?
nehmen wir an ich möchte ihn nicht mittig, sondern ganz rechts inenrhalb einer bestehenden html-Seite haben, und z.B neben Produktbeschreibungen.

[mali]

Das kann ich Dir nicht beantworten, wenn ich die Seite nicht kenne auf der es eingebaut werden soll :-) Eine Pauschalantwort gibt es da nicht. Generell ist es ganz nützlich HTML zu können, wenn man eine HTML-Seite erstellt ;-)

[S.w.a.p]

Ok, ich möchte den Banner in diese Seite einbinden:

http://www.meister-repro.de/supplies2.html

Ich habe den Code mal an beliebiger Stelle eingefügt. Was ist hier nun falsch, weil nichts angezeigt wird? Bei leeren Seiten klappt es ja.

EDIT: Habs geschafft, funktioniert nur wenn der Code unter </style></head>
<body> eingefügt wird. Aber wie ich den Banner jetzt noch an die richtige Stelle bekomme ...  :icon_rolleyes:

[mali]

Jesus, das ist mal ein wirklich wüster HTML-Code ;-)

Der Fehler im Moment ist, das Du den Flash-Code einfach inmitten von anderem Code eingefügt hast.
Der muss schon im <body>-Teil des Codes auftauchen.

Den Code habe ich hier mal einigermaßen bereinigt und rechts um eine Tabellenspalte ergänzt. Dort wo steht "hier das flash hin", da muß... Genau, der Flash-Code hin ;-)

Code:

Code [Auswählen] Erweitern

<html><head><title>www.plotwelt.de_supplies</title>
<style type="text/css">
body { background-image:url(../pics/wmsuppliesimage.gif); background-repeat:no-repeat; }
</style></head>
<body>

<table border="1" cellpadding="0" cellspacing="0" width="600"> <tbody>
<tr><td colspan="3"> <p> &nbsp; </p></td> </tr>

<tr> <td rowspan="8" width="23"> <p> links </p> </td>
<td style="font-weight: bold; color: rgb(102, 51, 102);" width="600"><ul> <li> <font face="Arial" size="1">&nbsp;<big>Tinten
f&uuml;r Deskjet_A4 / A3 Drucker</big></font> </li></ul> </td>
<td rowspan="8"  valign="top">  hier das flash hin  </td></tr>

<tr style="font-weight: bold; color: rgb(102, 51, 102);"> <td width="600"> <ul> <li> <font face="Arial" size="1">&nbsp;<big>Toner f&uuml;r_&nbsp;A4 / A3 Laser - und Colorlaser</big></font></li> </ul> </td>

</tr> <tr style="font-weight: bold; color: rgb(102, 51, 102);"> <td width="600"> <ul> <li> <font face="Arial" size="1">&nbsp;<big>Tintensysteme Gro&szlig;format (UV / Dye / Pigment)</big></font> </li></ul> </td> </tr>

<tr style="font-weight: bold; color: rgb(102, 51, 102);"> <td width="600"> <ul> <li> <font face="Arial" size="1">&nbsp;<big>Toner f&uuml;r Grosskopierer</big></font> </li> </ul> </td></tr>

<tr style="font-weight: bold; color: rgb(102, 51, 102);"><td width="600"> <ul> <li> <font face="Arial" size="1">&nbsp;<big>OPC - Trommeln</big></font> </li> </ul> </td></tr>

<tr style="font-weight: bold; color: rgb(102, 51, 102);"><td width="600"> <ul> <li> <font face="Arial" size="1">&nbsp;<big>Druckk&ouml;pfe f&uuml;r Grossformatplotter</big></font> </li> </ul></td></tr>

<tr style="font-weight: bold; color: rgb(102, 51, 102);"> <td width="600"> <ul> <li> <font face="Arial" size="1">&nbsp;<big>Ersatzteile</big></font></li> </ul> </td> </tr>

<tr> <td width="600"><ul><li> <font face="Arial" size="1">&nbsp;<b><font color="#663366"><big>Resttonerbeh&auml;lter</big></font></b></font></li></ul></td> </tr>

</tbody></table>
</body></html>



[S.w.a.p]

 :icon_mrgreen:

Sorry ich bin echt absoluter Laie auf dem Gebiet, ich habe auch kein Plan wie du das jetzt durch welche Befehle nach rechts verschoben hast, nur jetzt sind die Abstände derProdukte viel größer und auch die Tabelle sieht man.

Gibt es eigentlich keine Programme, die einem da Arbeit abnehmen?
Bei Frontpage gab es mal eine Funktion zum Bilder einfügen, die dann einfach an die gewünschte Stelle verschoben wurden und der Code dabei automatisch geschrieben wurde.

[mali]

:icon_mrgreen:

Sorry ich bin echt absoluter Laie auf dem Gebiet, ich habe auch kein Plan wie du das jetzt durch welche Befehle nach rechts verschoben hast, nur jetzt sind die Abstände derProdukte viel größer und auch die Tabelle sieht man.

Sieht doch schon ganz brauchbar aus :) Einfach den Rand der Tabelle wieder auf Null setzen:

<table border="1" cellpadding="0" cellspacing="0" width="600">

Bei Border aus der 1 eine 0 machen.

Gibt es eigentlich keine Programme, die einem da Arbeit abnehmen?

Nicht wirklich, unterstützen bestenfalls. Letztendlich muss aber aber immer wissen was man da tut. Schreiben kannst Du ja schließlich auch nicht, ohne das Alphabet zu kennen, da nützt Dir dann auch eine Software wie Word nichts :)

Wenn Du das "Alphabet" kennen lernen möchtest. Hier steht es:
http://de.selfhtml.org/

Bei Frontpage gab es mal eine Funktion zum Bilder einfügen, die dann einfach an die gewünschte Stelle verschoben wurden und der Code dabei automatisch geschrieben wurde.

Frontpage hat alles mögliche "geschrieben", aber keinen brauchbaren Code :)

[S.w.a.p]

Danke für den Link, das heißt für mich erstmal Grundkenntnisse einholen und viel lesen 

[S.w.a.p]

Hallo Mali, du könntest mir aber noch verraten wie ich den Banner weiter nach rechts bekomme ohne dass das Supplies Logo verdeckt wird. Irgendwie ist auch der banner in der Tabelle integriert und aufgrund der Größe verschieben sich dann auch die Abstände der einzelnen Produkte.

Momentan sieht es so aus


http://www.meister-repro.de/supplies2.html

[mali]

Du müßtest eigentlich nur die Tabelle verbreitern (<TABLE WIDTH="zahl"), aber das wird Dir bei der Seite nicht nützen, da ja alles in einem relativ unnötigen und veralteten Frameset geschieht. Der rechte Frame ist alleine da, um die andere Hälfte der Weltkugel darzustellen. Der Platz ist also allein wegen den Hintergrundgrafiken begrenzt.

Du könntest das Flash auch einfach in diesem Frame einbauen:
http://www.meister-repro.de/spaceframe.htm

Aber dann taucht der auf jeder Seite auf und nicht nur auf der "Supplies"-Seite.

Grundsätzlich ist es leider so, das die Seite von der Aufteilung und Programmierung her ziemlicher "Murks" ist (ich trete da hoffentlich niemandem zu Nahe :-) ) und man eigentlich am besten einmal eine Grundsanierung anberaumen müßte. Bis dahin geh nur flicken und zurechbiegen ;)

[S.w.a.p]

Hi Mali,

also die Seite hat mein Vorgänger hier erstellt, wieso der das teilweise so aufwändig und verschachtelt gemacht hat, entzieht sich meiner Kenntnis, du trittst also keinem zu Nahe :)

Das mit der Tabelle kriege ich so nicht hin, denn egal wo ich den Code einbaue, verschieben sich entweder die Texte oder ich bekomme das Teil nicht auf die Stelle die ich will.

Ich sehe in den Tags zwar an welcher Stelle der Tabelle das Objekt drin ist, jedoch verändert sich mit jeder Änderung auch der Text, ich bekomme es irgendwie nicht hin, das Teil separat zu behandeln. Aber das war schon immer mein Problem mit Tabellen bei der Homepageerstellung.

Hier siehst du es:

http://www.meister-repro.de/supplies5.html

Das Objekt hab´ich jetzt unterhalb der Texte in der Tabelle eingefügt, weil sich sonst die Zeilen verschieben. Aber ich kriege das jetzt nicht nach rechts oben oder ?

Ich schff es auch nicht das Objekt neben die halbkugel zu setzen in "spaceframe", wo liegt den da der Trick?

Quellcode bei Spaceframe:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html><head>
<title>Kein Titel</title></head>
<body alink="red" bgcolor="white" link="blue"
text="black" vlink="purple"><p><img
src="wmlogos/plotweltrechts.gif" border="0" height="300"
width="108"></p>
</body></html>

Wo muss jetzt hier das Flash rein damit es direkt neben der Halbkugel sitzt ?

[mali]

also die Seite hat mein Vorgänger hier erstellt, wieso der das teilweise so aufwändig und verschachtelt gemacht hat, entzieht sich meiner Kenntnis, du trittst also keinem zu Nahe :)

OK :)

Das mit der Tabelle kriege ich so nicht hin, denn egal wo ich den Code einbaue, verschieben sich entweder die Texte oder ich bekomme das Teil nicht auf die Stelle die ich will.

Ja, das ist der Mist an Tabellen und der Grund warum man solche Dinger auch nie als Layout-Mittel gebrauchen sollte. Inzwischen ist man dank CSS dazu auch nicht mehr "gezwungen".

Ich schff es auch nicht das Objekt neben die halbkugel zu setzen in "spaceframe", wo liegt den da der Trick?

Quellcode bei Spaceframe:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html><head>
<title>Kein Titel</title></head>
<body alink="red" bgcolor="white" link="blue"
text="black" vlink="purple"><p><img
src="wmlogos/plotweltrechts.gif" border="0" height="300"
width="108"></p>
</body></html>

Wo muss jetzt hier das Flash rein damit es direkt neben der Halbkugel sitzt ?

Nimm mal das:

Code [Auswählen] Erweitern

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>

<head>
<title>.</title>
</head>

<body bgcolor="white" marginheight="0" marginwidth="0" leftmargin="0" topmargin="0">

<table border="a" cellpadding="0" cellspacing="0" width="350">
<tr>

<td align="left" valign="top">

<img src="wmlogos/plotweltrechts.gif" border="0" height="300" width="108">

</td>
<td align="left" valign="top">

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" height="500" width="250"><param name="movie" value="flash/exploding_bouquet_120x600_20070412.swf"><param name="quality" value="high"><embed src="flash/exploding_bouquet_120x600_20070412.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" height="100" width="121">
</object>

</td>

</tr>
</table>

</body></html>


[S.w.a.p]

Danke, nur wo liegt nun hierbei der Trick?

Border = 0, dann sieht es so aus:

http://www.meister-repro.de/spaceframe3.html

Kann ich den Banner jetzt nicht noch dichter an die Kugel bekommen? Sonst wird das Ganze zu breit  :icon_cool:

[mali]

Danke, nur wo liegt nun hierbei der Trick?

Inwiefern?

Border = 0, dann sieht es so aus:

http://www.meister-repro.de/spaceframe3.html

Kann ich den Banner jetzt nicht noch dichter an die Kugel bekommen? Sonst wird das Ganze zu breit  :icon_cool:

Leider hat der Flash-Banner links und rechts ja einen integrierten weissen Hintergrund. Der ist nicht wegzubekommen und sorgt für den "Abstand".

[S.w.a.p]

*Heul* dann kann ich das wohl vergessen...

Ich meinte mit dem Trick nur wie du den befehl gibst, dass das Objekt an die oder die Stelle hinsoll.

[mali]

*Heul* dann kann ich das wohl vergessen...

Ich meinte mit dem Trick nur wie du den befehl gibst, dass das Objekt an die oder die Stelle hinsoll.

Das ist nur Fake, weil eine Tabelle dazu "mißbraucht" wird Objekte zu platzieren. Wenn Du den Border anmachst, dann siehst Du ja was eigentlich Sache ist". Du malst halt mit einer Tabelle einen Kasten, sagst wie groß die Tabelle und die Abstände sind und wirfst Grafiken, Text oder Sonstiges in die Zellen hinein.

Das hat man jahrelang so als Designkrücke benutzt, aber inzwischen gibt es zum Glück andere Methoden dafür, dank CSS. Tabellen-Layouts sind langsam, fehleranfällig, Browserabhängig und alles andere als Barrierearm. Siehe OFDB-Webseite ;-)

[S.w.a.p]

Hallo,

eine Frage hätte ich noch. Vereinfacht:

ich möchte diesen Film bzw. das Objekt nicht links oben haben, sondern nach Lust und Laune entweder mittig rechts, links usw. verschieben zum "lernen" :)

Wie lauten hierzu die Codes? Das hba´ich noch nicht rausgefunden.

http://www.meister-repro.de/index4.html

[Darkling Nocturnal]

Kenne mich da zwar jetzt auch nicht so aus, aber probier's mal hiermit:

In den HEAD-Bereich folgenden Code:

Code [Auswählen] Erweitern

<style type="text/css">
<!--
#Layer1 {
position:absolute;
width:200px;
height:115px;
z-index:1;
left: 86px;
top: 68px;
}
-->
</style>

In den Body:

Code [Auswählen] Erweitern

<div id="Layer1">Her steht der Quelltext </div>

Mit left und top bestimmt du den Abstand vom linkeren und oberen Bildschirmrand. Über width und height stellst du die Größe der Ebene ein.

Her steht der Quelltext -> Dort wird logischerweise der Quelltext des Filmes/Objektes eingetragen.