12 - Krümelnavigation
Um eine Krümelnavigation (Breadcrump) in der Seite anzuzeigen, müssen PHP-Platzhalter und CSS-Deklarationen in die Seite eingefügt werden. Wenn wir diese Krümelnavigation nur einblenden wollen wenn Unterseiten angewählt werden, müssen wir zusätzlich abfragen ob eine Unternavigation auf Ebene 2 angezeigt wird. (Eine Anzeige der obersten Ebene in der Krümelnavigation macht wenig Sinn, der aktive Navigationspunkt wird bereits durch das 'highlighting' der Top-Navigation angezeigt.)
Die Datei: BreadCrumbs.ss liegt im Ordner Includes bereit. Ein Blick auf den Quelltext zeigt uns wie die Einbindung der Krümelnavigation stattfindet. (Du kannst nun den Quelltext in deinen Code einfügen, oder ein 'include' auf die bestehende Datei einfügen.)
<% if $Level(2) %>
<div id="Breadcrumbs">
$Breadcrumbs
</div>
<% end_if %>
<% include BreadCrumbs %>
Die Krümelnavigation soll in unserem Template im 'footer' angezeigt werden.
1. Füge den include-Code in den footer der Datei Page.ss' ein
2. Speichere und publiziere die Datei
3. Untersuche das Ergebnis im Browser
Kleine Feinheiten machen den Unterschied
Beachte den Unterschied der beiden Abfragen für die Unternavigation (Datei: SideBar.ss)
<% if Menu(2) %>
oder die Abfrage für den 'Breadcrump' (Datei: BreadCrumbs.ss)
<% if Level(2) %>
Es funktionieren beide if-Abfragen. Es zeigt sich aber ein interessanter kleiner Unterschied.
Ist eine Unterseite gewählt, erscheint die Krümelnavigation, egal ob die Abfrage mit 'if Level(2)' oder 'if Menu(2)' gestellt wird, in beiden Fällen mit dem gleichen Resultat.
Wenn die Abfrage mit 'if Menu(2)' erstellt wird, wird die Krümelnavigation eingeblendet, sobald der Top-Navigationspunkt geklickt wird, der Unterseiten enthällt.
Ein Menu(2) existiert zwar, wenn es aber nicht angewählt ist, sollte es auch nicht angezeigt werden.
Wenn die Abfrage mit 'if Level(2)' gestellt wird, wird die Krümelnavigation beim Klick auf die Top-Navigation nicht eingeblendet. Die Krümelnavigation macht erst Sinn, wenn eine der Unterseiten gewählt ist.
Das bedeutet:
'if Menu(2)' fragt ab, ob ein Menu auf Ebene 2 existiert.
'if Level(2)' fragt ab, ob eine Unternavigation auf Ebene 2 angewählt ist.