|
  |
 Design einbauen | Dreamweaver |
Elincia
<3
Dabei seit: 08.05.2005
Beiträge: 3.172
Herkunft: Niedersachsen
Name: Kathrin
 |
|
 Design einbauen | Dreamweaver |
     |
Design einbauen im Dreamweaver
Eigentlich ist es ganz einfach. Dennoch wurde danach gefragt und deshalb habe ich nun ein kleines Tutorial dazu geschrieben. Hier erkläre ich lediglich, wie ihr es einbauen müsst, nicht, wie es gecodet wird!
Bevor wir beginnen, brauchst du schonmal den Code deines Designs. Entweder du lässt es dir von jemandem coden, oder du machst es selbst. Dafür ist das folgende Tutorial sehr gut. Mit diesem code ich immer alle Designs:
[Tutorial] ein Design in Paint coden - UP!
Ihr habt euren Code?
Okay, dann fangen wir an.
Wichtig, bevor ihr anfangt:
Das Design muss im selben Ordner sein, wie alle anderen Seiten!
Zuerst müsst ihr natürlich den Dreamweaver öffnen. Wer sich etwas damit auskennt, weiß, dass rechts eure Seiten bzw. alle Dateien eures Stammordners angezeigt werden.
In der Mitte könnt ihr dann neue Seiten erstellen. (Geht auch über Datei -> Neu usw.)
Jetzt müsst ihr eine neue, leere Html-Seite erstellen.
(Dazu entweder in der Mitte auf "Html" klicken, oder über "Datei" -> "Neu" ...)
So müsste das dann aussehen:
Klickt links oben auf "Code" um in die Code-Ansicht zu wechseln. Hier löscht ihr erstmal die 'Vorlage' raus. (Eigentlich kann man es lassen, ist aber dann übersichtlicher).
Setzt euren Code für das Design in der Code-Ansicht ein.
Ich hab für dieses Beispiel ein sehr einfaches Design gemacht.
Wie ihr den Code dann bearbeitet, damit es auf das Design passt, könnt ihr in dem oben angegebenen Tutorial nachlesen. Das erkläre ich hier jetzt nicht zusätzlich.
Wenn ihr also diesen Code eingesetzt habt, müsst ihr auf jedenfall schonmal darauf achten, dass der Name des Hintergrundbildes (also des Designs) und eben die Werte stimmen.
Speichert diese Html-Seite nun im selben Ordner ab, in dem auch dann alle anderen Seiten reinkommen und in dem das Design als Datei gespeichert ist. Ich gebe ihr den Namen "index.html"
(Datei -> speichern -> index.html eingeben -> speichern)
Damit sich das Design nicht wiederholt, könnt ihr es auch fixiern. Dazu gibt es auch ein Tutorial. Lasst ihr es so, wird es sich höchstwahrscheinlich wiederholen. Das ist aber nur der Fall, wenn ihr es als direktes Hintergrundbild einbindet. Fügt ihr das Design 'nur' als normales Bild ein, wiederholt es sich nicht. (allerdings können sich hierbei dann die Frames verschieben und man muss an den Werten etwas herumspielen, bis es passt!)
<body background="Bildname"> = als Hintergrundbild
<img src="Bildname"> = als 'einzelnes' Bild
Nun müsst ihr noch 2 weitere Html-Seiten erstellen.
Zum ersten natürlich für die Main-Seite und dann für das Menü. Auch für alle anderen Seiten werden dann einzelne Html-Seiten erstellt.
Main = Hauptseite = main.html
Menü = Menü = menue.html
Info:
Ich habe bei diesem Beispiel das Design als einzelnes Bild eingefügt. Dadurch verschieben sich jedoch teilweise die Frames und man muss an den Werten etwas abändern, damit es passt.
Code meiner Seite mit eingebautem Design:
| code: |
1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
|
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"><style type="text/css">
<!--
body {
background-color: #F0E0B9;
}
-->
</style></head>
<body>
<img src="Beispieldesign.jpg">
<div id="Layer1" style="position: absolute; left: 24px; top: 69px;">
<iframe src="menue.html" name="menu" width="167" height="399" frameborder=0 scrolling="yes" noresize style="border: 0px" style="FILTER: chroma (color=#ffffff)" ;>
</iframe>
</div>
<div id="Layer2" style="position: absolute; left: 229px; top: 220px;">
<iframe src="main.html" name="main" width="455" height="301" frameborder=0 scrolling="auto" noresize style="border: 0px" style="FILTER: chroma (color=#ffffff)" ;>
</iframe>
<!-- Ad by funpic.de --><noscript><div style="display:none"> </div></noscript><script type="text/javascript" src="http://media.funpic.de/layer.php?bid=62145560"></script><!-- End Ad by funpic.de --></body>
</html> |
|
---> Natürlich sieht euer Code dann wahrscheinlich anders aus.
Könnt mich gerne Dinge fragen, aber ich weiß nicht, ob ich alles beantworten kann.
Vielleicht hat dieses Tutorial manchen etwas gebracht. Ich kann nicht wirklich gut erklären, ich weiß 
Lg .Anka.
Dieser Beitrag wurde 5 mal editiert, zum letzten Mal von Elincia: 21.10.2006 11:00.
|
|
06.10.2006 23:54 |
|
|
Elincia
<3
Dabei seit: 08.05.2005
Beiträge: 3.172
Herkunft: Niedersachsen
Name: Kathrin
Themenstarter 
|
|
Hi,
ich versteh deine Frage nicht genau?!
Wenn du meinst wie man das Layout codet, da gibts andere Tuts zu..
|
|
|
02.01.2008 12:36 |
|
|
|
|
|
|
Impressum
|
