Dreamweaver-Vorlagen
Wenn eine HTML-Seite als Vorlage gespeichert wird, erstellt Dreamweaver einen Vorlagenordner auf der Stammebene des lokalen Stammordners und generiert eine.dwt-Datei, die als Quelle für alle Seiten gilt, die an dieser angewendet werden. Jedes Mal, wenn eine HTML-Seite an einer Vorlage angewendet wird (Datei > Neu von Vorlage oder Ändern > Vorlage > Vorlage auf Seite anwenden), erstellt diese einen Site-Stammverzeichnis-Link zur.dwt-Datei. Der Grund, warum dieser Site relative Link immer korrekt verlinkt ist, ist weil die.dwt-Datei immer im Vorlagen Ordner auf der Stammebene der Ordnerstruktur der Site ist. Wenn die .dwt-Datei vom Vorlagenordner verschoben wird, oder wenn der Vorlagen Ordner verschoben oder umbenannt wird, wird der Link aufgelöst. Es ist sehr wichtig, die.dwt-Datei im Vorlagenordner zu behalten, in dem sie Dreamweaver erstellt hat. Um Verwirrungen zu vermeiden, ist es ratsam andere Elemente Ihrer Site (Bildquelle Dateien oder HTML-Dokumente) innerhalb des Vorlagen Ordners NICHT zu speichern.
Wie werden Seiten zu Vorlagendateien verknüpft?
Wenn eine Datei auf einer bestehenden Seite angewendet oder neu von einer Vorlage erstellt wird, wird der folgende Code in die Quelle eingefügt:
<!-- #BeginTemplate "/Templates/templateName.dwt" -->
Um den HTML-Quellcode anzuzeigen, den Dreamweaver erstellt, wählen Sie Window > HTML.
Der Pfad ersetzt die normale HTML-Quelle die auf einer neuen Seite angezeigt werden würde. Anstatt mit den üblichen Tags, die eine neue Datei generieren würden zu beginnen, gibt es diese weitere Ebene im lokalen Stammordner an, in einem Ordner namens „Templates“, es existiert eine.dwt-Datei, die alle Informationen nicht innerhalb der bearbeitbaren Bereiche dieser Seite enthält. Dieser Pfad sendet den Browser, damit dieser am richtigen Speicherort nach der Datei sucht, die die Seiteneigenschaften, Layout und Grafiken bereitstellen wird - allen Inhalte, die nur in der.dwt-Datei vorhanden sind. Daher müssen Änderungen außerhalb der bearbeitbaren Bereiche einer Seite direkt an der .dwt-Datei vorgenommen werden. Wenn die .dwt-Datei selbst geöffnet und überarbeitet wird, werden alle Seiten, die auf der Vorlage angewendet werden, mit der Datei im selben Ordner wie zuvor, verlinkt. Alle Seiten, die auf der Vorlage angewendet werden, werden automatisch mit der neuen Information aktualisiert werden.
Dokumentrelativ versus Stammverzeichnis
Der Pfad der eine HTML-Seite mit einer Vorlage verknüpft, ist ein Stammverzeichnis Pfad. Es wird Stammverzeichnis genannt weil es auf der obersten Ebene der Verzeichnisstruktur (der lokale Stammordner) startet, und dann zum nächsten Ordner führt (Vorlagen) und sich schließlich mit der .dwt-Datei verknüpft. Dreamweaver erstellt automatisch einen Stammverzeichnis Pfad zu den Vorlagen im Vorlagenordner, da es genau weiß, wo die Vorlage gespeichert werden wird, unabhängig davon wo andere Dateiordner in der Site-Struktur vorhanden sind.
Dokumentrelativ erstellt einen Pfad spezifischen aus einer Datei zur anderen. Anstatt an der obersten Ebene (Sitestamm) Ihrer Dateiordnerstruktur anzufangen, generiert es einen Pfad der an einer Datei beginnt, geht anschließend durch jegliche erforderliche Dateiordner (Verzeichnisse) und hält am Speicherort der anderen Datei an. Es ist unerlässlich, dass beide Dateien im lokalen Stammordner gespeichert werden, BEVOR eine dokumentenrelative verknüpfung von einer Datei auf eine andere erstellt wird.
Wenn Sie Ihre Seiten in einem Browser lokal in einer Vorschau sehen möchten, bevor Sie die Dateien auf einen Remote-Server hochgeladen haben, müssen diese dokumentenrelativ sein. Sowohl für Internet Explorer als auch für Netscape Browser gibt es keine Möglichkeit zu verstehen welcher lokale Stammordner definiert wurde (sowie bei Dreamweaver), es kann also nur einen Pfad folgen der relativ zum Dokument ist der momentan angesehen wird. Da die meisten Benutzer es vorziehen, die Seiten in einem Browser lokal zu sehen bevor sie diese hochladen, Dreamweaver mangelt daran dokumentenrelativ zu sein, wenn eine Datei verknüpft ist, oder ein Bild eingefügt wird. Falls die Datei noch nicht gespeichert wurde, BEVOR versucht wird ein Bild einzufügen oder eine Verknüpfung zu einer anderen HTML-Seite, dann hat Dreamweaver keine Referenz für den Speicherort der aktuellen Seite, daher wird es einen Pfad generieren, der in etwa so aussieht:
file:///HardDrive/Desktop Folder/localRootFolder/subfolder/subfolder/images/content.htm
oder
file:///C:/Desktop/localRootFolder/subfolder/subfolder/images/content.htm
Diese Pfade sind AUSSCHLIEßLICH spezifisch für Ihre Workstation und wird nicht funktionieren wenn Sie Dateien auf einen Remote-Server hochladen.
Die folgende Tabelle zeigt eine grafische Erläuterung des Unterschieds zwischen dokumentenrelativ und Stammverzeichnis. Im unten aufgeführten Beispiel beinhaltet die Seite bio.htm eine Grafik namens logo.jpg, die alternative Pfad Auswahlsmöglichkeiten verwenden.
|
Dokumentenrelative Pfade in der Vorlage
Die direkte Einfügung von Bildern und Links in die.dwt-Datei kann verwirrend sein. Beachten Sie während der Arbeit in der.dwt-Datei dass jede Verbindung, die Sie als dokumentrelativ erstellen, genau das sein wird - relativ zur .dwt-Datei. Der Pfad, der generiert wird, ist spezifisch von dieser HTML-Seite oder Bildquelle zur .dwt-Datei. Dreamweaver speichert einen Datensatz davon, wo die betreffenden Seiten auf die Vorlage live angewendet werden, dieser passt den Pfad automatisch zur referenzierten HTML-Datei an, damit diese korrekt für die aktuelle Seite ist. Wenn Sie auf den HTML-Quellcode sowohl für den .dwt als auch für auf einer Vorlage angewendeten Seite schauen, dann werden Sie sehen dass die Pfade unterschiedlich sind, and so muss es auch sein. Wenn Dreamweaver nicht automatisch den Pfad für den spezifischen Speicherort der einzelnen Seiten regulieren würde, dann würde der dokumentenrelative Pfad für alle Dateien mit Ausnahme der.dwt-Datei aufgelöst sein.
Im Folgenden finden Sie ein Beispiel der Art und Weise, wie Dreamweaver den dokumentrelativen Pfad regulieren könnte:
Der Originalpfad aus der Vorlage zur Grafik: |
../graphics/images/banner.gif |
Der regulierte Pfad in der an der Vorlage angewendeten Seite: |
../../graphics/images/banner.gif |
Dreamweaver reguliert jedoch nicht die Stammverzeichnis oder absolute (http://) Pfade aus der Vorlage zu den Seiten die auf der Vorlage angewendet werden, da es nicht notwendig ist, diese zu überarbeiten.
Dokumentrelative Pfade in den Seiten angewendet auf der Vorlage
Einfügen von Bildern und Links innerhalb des bearbeitbaren Bereichs einer Seite zu einer Vorlagenarbeit genauso wie das Einfügen von Bildern oder Links in eine Seite, die nicht mit einer Vorlage verknüpft ist. Wenn Sie den folgenden Vorgang Datei auswählen > Neu aus Vorlage, dann Datei > Speichern (einen Speicherort innerhalb des lokalen Stammordners auswählen) ausführen, BEVOR Sie irgendwelche Links zu anderen Seiten oder Bildern erstellen, wird Dreamweaver an dokumentenrelativ sowohl in den Dialogfenstern von Select HTML Page oder Select Image Source vorgeben. Solange das „Relative To“ Pop-up Menü nicht manuell geändert wird, um Stammordner auswählen, werden die Bilder und Links verfügbar sein, wenn Sie Ihre Arbeit im Browser lokal in der Vorschau ansehen.
Stammverzeichnis Pfade in der Vorlage
Wenn Sie an einer Vorlagendatei arbeiten, um Verknüpfungen zu anderen Seiten zu erstellen oder um die Bildquelle von Grafiken zu referenzieren, wird Ihnen das Pop-up Menü in den Dialogfenstern Select HTML File und Select Image Source erlauben, zwischen den dokumentrelativen und stammrelativen zu entscheiden. Wie auf dem oberen Diagramm angezeigt, das Auswählen des Stammordners erstellt einen Pfad aus dem lokalen Stammordner direkt zu der ausgewählten Datei, unabhängig von der.dwt-Datei, die derzeit in Dreamweaver geöffnet ist. Die Verwendung von stammrelativen Links kann nützlich sein, wenn sich der Inhalt in der Siteordnerstruktur wahrscheinlich innerhalb des lokalen Stammordners der Site bewegen wird, weil der Link unversehrt bleiben wird, selbst wenn die Dateien von ihrem ursprünglichen Speicherort verschoben werden.
Der Originalpfad aus der Vorlage zur Grafik: |
/graphics/images/banner.gif |
Der Pfad in der an der Vorlage angewendeten Seite: |
/graphics/images/banner.gif |
Dreamweaver reguliert jedoch nicht die Stammverzeichnis oder absolute (http://) Pfade aus der Vorlage zu den Seiten die auf der Vorlage angewendet werden, da es nicht notwendig ist, diese zu überarbeiten. Der Speicherort des Dokuments (unabhängig davon, ob es die.dwt-Datei ist oder die HTML-Datei, die mit der Vorlage verknüpft ist), ist irrelevant zu einem Stammverzeichnis Pfad.
Stammverzeichnis Pfade in den Seiten verwendet in der Vorlage
Die Verwendung von stammrelativen Links kann hilfreich sein, wenn die Site komplex ist, eine Zusammenarbeit von Entwicklern verwendet wird, oder wenn es eine Site-Verzeichnisstruktur hat die regelmäßig überarbeitet wird. Um eine stammrelative Verknüpfung zu erstellen, wählen Sie einfach „Stammordner“ aus dem Popup-Menü neben dem Wort „bezüglich“, welches sich auf den Dialogfeldern sowohl von „Bildquelle auswählen“ als auch von „HTML-Datei auswählen“ befindet.
Da der erstellte Pfad beim lokalen Stammordner beginnen wird, hindurch einer beliebigen Anzahl an Unterordnern und schließlich vom Ende der Seite oder Bildes die verknüpft sind, haben Entwickler die Flexibilität Seiten oder Assets einen oder mehreren Unterordnern in der Siteordnerstruktur zu bewegen, ohne die Links zu unterteilen. Zum Beispiel, beim obigen Diagramm, wenn die logo.jpg-Datei vom Bilder Ordner in den Feature Ordner verschoben werden sollte und der Link ein Site-Stammordner-relativer Link wäre, dann würde der Browser noch immer kein Problem damit haben die Grafik zu lokalisieren. Wenn der Pfad ein dokumentrelativer Link ist, MÜSSEN beide logo.jpg und bio.htm-Dateien in der Ordnerstruktur bleiben, an der sie waren, als der dokumentrelative Pfad erstellt wurde. Das Verschieben jeglicher Dateien, nachdem der Pfad erstellt wurde, wird zur Beschädigung des Pfads führen.
Wie bereits erwähnt, können nur lokal dokumentrelative Links im Browser in der Vorschau angezeigt werden. Wenn Sie sich dafür entscheiden, Site-Stammordner relative Links zu verwenden, gibt es nur zwei Möglichkeiten, Ihre Seiten im Browser zu sehen.
Die erste Möglichkeit besteht darin, die Dateien auf den Remote-Server hochzuladen, und dann benutzen Sie den Browser um auf die gewünschte Seite zu gelangen, indem Sie den absoluten Pfad auf dem URL-Locatorgebiet eingeben. Mit dieser Methode werden die Seiten angezeigt, so wie sie von anderen im Web gesehen werden können. Um Änderungen an den Seiten vorzunehmen, öffnen Sie die lokale Kopie der Dateien, nehmen Sie die Änderungen vor, speichern Sie die HTML-Seiten, stellen Sie eine Verbindung zum ftp-Server und „legen“ Sie die neuen Dateien auf dem Remote-Server. Dateien mit dem gleichen Namen im gleichen Ordner werden die älteren Versionen der Datei auf dem Remote-Server überschreiben.
Die zweite Möglichkeit, Site-relative Links im Browser in der Vorschau anzuzeigen, ist es indem Sie einen persönlichen Webserver verwenden. Nur bei Windows kann diese Option eingestellt werden, in dem Sie zu Dreamweaver über den Befehl „Datei“ > „Vorschau in Browser“ > „Browserliste bearbeiten“ und „Vorschau mithilfe des lokalen Servers“ auswählen. Wenn Sie diese Option aktivieren, kann Dreamweaver Dokumente in der Vorschau anzeigen, wenn Sie einen persönlichen Webserver verwenden.
Hinweis: Bei Macintosh ist ein persönlicher Webserver auf der Systemebene festgelegt. Überprüfen Sie in der Dokumentation, um weitere Unterstützung zu erhalten.