Sie sind hier: Startseite >> Tipps & Downloads >> Tipps für den "Selbstvollender" - Teil 10
 
 

Einfache und nützliche Tipps für den "Selbstvollender" - Teil 10

 

Eine Breadcrumb-Navigation mit Hilfe von Dreamweaver's "Optionalen Bereichen" erstellen

Mit den Dreamweaver-Templates steht ein mächtiges Werkzeug zur Verfügung, mit dem sich auch große Websites bequem verwalten und pflegen lassen. Baut man nun in ein DW-Template so genannte "Optionale Bereiche" ein, dann reicht dieses eine Template aus, um damit z.B. eine Sprachversion einer Website komplett zu verwalten.

Üblicherweise lassen sich auf diese Weise mehrstufige Navigationsleisten mit Feedback-Funktion zur Hervorhebung der aktuell geöffneten Seite einer Internetpräsentation erzeugen. Doch kann man das um optionale Bereiche erweiterte Dreamweaver-Template auch sehr einfach für die (halb-)automatische Erzeugung einer Breadcrumb-Navigation einsetzen.

Wichtig ist zuerst die Definition der Optionalen Bereiche im Head-Bereich des Quellcodes, z.B. in der Form:

<!--TemplateParam name="rub0" type="boolean" value="false" -->
<!--TemplateParam name="rub1" type="boolean" value="false" -->
<!--TemplateParam name="rub2" type="boolean" value="false" -->
<!--TemplateParam name="rub3" type="boolean" value="false" -->
<!--TemplateParam name="rub4" type="boolean" value="false" -->
<!--TemplateParam name="rub4sub1" type="boolean" value="false" -->
<!--TemplateParam name="rub5" type="boolean" value="false" -->
<!--TemplateParam name="rub6" type="boolean" value="false" -->
<!--TemplateParam name="rub7" type="boolean" value="false" -->

wobei "rub4sub1" für eine Unterrubrik "sub1" der Rubrik "rub4" steht .

Der eigentliche Quellcode für den Container mit dem Breadcrumb-Navigation sieht z.B. so aus:

Quellcode für den Container mit dem Breadcrumb-Navigation

Im Entwurfsmodus von Dreamweaver ergibt der vorstehende Quellcode folgende Ansicht:

Breadcrumb-Navigation in der Entwurfsansicht, Teil 1

Für die Einblendung der Navigation entscheidend sind die Formulierungen im entsprechenden div-Container:

<!-- TemplateBeginIf cond="rub0" --><a href="../it/index_i.html">Pagina iniziale</a><!-- TemplateEndIf -->

<!-- TemplateBeginIf cond="!rub0" --><a href="../it/index_i.html">Pagina iniziale</a> &gt;&gt; <!-- TemplateEndIf -->

Soll z.B. die Breadcrumb-Navigation für eine Unterseite der Rubrik 4 ("rub4") erzeugt werden, stellt man auf dieser Seite über das Menü "Modifizieren" die "Vorlageneigenschaften" so ein, dass die Bedingung "rub0" "falsch" ist und die Bedingungen "rub4" und "rub4sub1" jeweils wahr sind. Der Quellcode &gt;&gt; erzeugt die Doppelpfeile " >> " innerhalb der Breadcrumb-Zeile.

Einstellung der Vorlageneigenschaften

Breadcrumb-Navigation in der Entwurfsansicht, Teil 2

Über die Formulierung "!rub0" (das Ausrufezeichen steht für "ungleich") im Quellcode der Breadcrumb-Navigation wird somit der Link zur Startseite eingeblendet und vorgeschaltet. Jetzt muss noch im editierbaren Bereich mit dem hier vergebenen Namen "brotkrumen" die Überschrift zum jeweiligen Inhalt "(hier: Patentino per saldatore") auf der neuen Seite von Hand eingetragen werden.

Dies führt dann im Browser zu folgendem Ergebnis:

Breadcrumb-Navigation in der Browser-Ansicht

Auf der aktuellen Website des Schweizerischen Vereins für Schweisstechnik, für die pro Sprachversion ein Dreamweaver-Template eingesetzt wird, finden Sie ein typisches Anwendungsbeispiel für eine so erstellte Breadcrumb-Navigation.

 

zur Sitemap

 

nach oben ©  web's tool | Seite Drucken