Benutzung des Dreamweaver-Templates1

Benutzung des Dreamweaver-Templates 1
Interaktive Werkstatt – WS 07/08
Die Zip-Files template_de.zip und template_en.zip mit den Ausgangsdateien
finden Sie im Blackboard der Interaktiven Werkstatt
(Kurs-Code: IAW-Sommer08).
Entpacken Sie das Zip-File template_xx.zip an einer von Ihnen gewünschten
Stelle. Nach dem Entpacken finden sie im Ordner doku_template_xx zwei
weitere Ordner:
● Templates: hierin ist die Dreamweaver-Vorlage schoenecker_doku.dwt
enthalten.
● vorname_nachname: in diesem Ordner ist eine index.html und eine
typographie.html, basierend auf dem Template, enthalten sowie ein
Ordner für Bilder und ein Ordner mit der CSS-Datei main.css.
Die Anpassung erfolgt in vier Schritten.
1. Dateien im Dreamweaver „bekannt machen“
Öffnen Sie Dreamweaver. Über die Befehlsfolge Site / Sites verwalten
erhalten Sie ein Dialogfenster in dem Sie über Neu / Site die Definitionen für
Ihre Projektdokumentation einstellen. Geben Sie bei den folgenden Abfragen
als Bezeichnung für die Site DOKU und als lokalen Stammordner
/Pfad_zum_/doku_template.
Sie haben nun die Verbindung zum Doku-Template und zu den bereits
vorgefertigten Dateien hergestellt, was Sie im Dreamweaver-Fenster Dateien
erkennen können. Damit alles richtig läuft, müssen nun noch ein paar
Änderungen vorgenommen werden.
2. Anpassen des Templates
● Einen eigenen Ordner anlegen:
Im Dreamweaver-Fenster Dateien
erstellen Sie einen eigenen Ordner mit
der Benennung
ihrvorname_ihrnachname. Markieren
Sie alle Dateien und Ordner im Ordner
vorname_nachname und ziehen Sie
diese in Ihren eigenen neuen Ordner.
Die Abfrage „Hyperlinks in den
folgenden Dateien aktualisieren?“
bestätigen Sie mit Aktualisieren.
1 Entwurf der Dokumentation von Tatevik Aghababyan, Dreamweaver-Template erstellt von
Korbinian Moser, überarbeitet von Anna-Lisa Schönecker und Martina Hammel. Stand
18.10.2007
1

● Das Template aktualisieren:
Interaktive Werkstatt – WS 07/08
Öffnen Sie nun das Template schoenecker_doku. Ändern Sie in der
Entwurfs-Ansicht Ihre Daten entsprechend (z.B. im Header und im
Footer)
● Speichern Sie nun das Template ab und lassen Sie alle Dateien
aktualisieren.
● Schließen Sie das Template.
3. Erstellen und Ändern von Seiten auf der Grundlage des Templates.
Erstellen bzw. ändern Sie zuerst die index.html (genau in dieser Weise
geschrieben!). Sie haben nur bestimmte Bereiche für die Bearbeitung
freigegeben:
● Die Breadcrumbs: Hier tragen Sie den aktuellen Pfad entsprechend Ihrer
Benennung in der Navigation zu dieser HTML-Seite ein. Bei der
index.html lautet dieser z.B. HOME.
● Ändern Sie den Content-Bereich
2

Interaktive Werkstatt – WS 07/08
● Aktive Menüzustände werden über Modifizieren /
Vorlageneigenschaften in den einzelnen Dateien angepasst. Jeder
Navigationseintrag ist mit einer CSS-Klasse in der Systematik
class_home, class_concept usw. versehen. Fügen Sie der zugewiesenen
Klasse NavMain oder NavSub Active hinzu. Die Klassen sind in der Datei
main.css im Ordner css mdefiniert.
Eine neue Seite erstellen Sie durch Datei / Neu – Sie erhalten ein Fenster
Neues Dokument in dem Sie Seite aus Vorlage und die Vorlage
schoenecker_doku auswählen.
3

Interaktive Werkstatt – WS 07/08
Speichern Sie Ihre Seiten in Ihren Ordner. Die Endung .html wird automatisch
angefügt.
4. Aktualisieren der Navigation
Wenn Sie alle Dateien erstellt haben, öffnen Sie das Template
schoenecker_doku. Sie müssen nun den Navigationseinträgen die entsprechenden
Dateien zuweisen.
● In der Entwurfsansicht erhalten Sie auf einem Navigationslink über die
rechte Maus-Taste bei Windows oder Ctrl-Taste und Maus-Klick bei Mac
ein Kontextmenü in dem Sie die Auswahl Link ändern haben. Hier
weisen Sie dann die entsprechende Datei zu.
4

Interaktive Werkstatt – WS 07/08
● Speichern Sie das Template und lassen Sie alle Dateien aktualisieren.
5