Vom Eintrag zur Komponente
Quartz liest die quartz.config.yaml und erzeugt für jeden aktiven Eintrag eine Komponente —
an der Stelle, die sein layout-Block nennt, oder ohne Block links mit priority: 10. Das Plugin bekommt dabei die options genau so, wie sie in der Datei stehen, und ergänzt
alles Fehlende aus seinen eigenen Vorgaben. Ein Wert, den es nicht kennt — variant: vertikal etwa —
wird durch die Vorgabe ersetzt und einmal gemeldet (9.2).
Zwei Einträge mit identischen Optionen teilt Quartz sich eine Komponente. Das ist harmlos, solange sie an verschiedenen Stellen stehen — außer bei den Element-IDs, siehe 7.3.
Vom Ordner zum Baum
Quartz reicht jeder Komponente die Liste aller Seiten des Baus herein. Daraus wird der Baum:
- Jede Seite wird ein Knoten. Ihr Pfad (
docs/setup) bestimmt, in welchem Ordner sie hängt. - Jeder Ordner wird ein Knoten, dessen Link die Ordnerseite ist —
docs/index. - Ausgeblendetes fällt heraus: Tag-Seiten, die 404-Seite, Entwürfe,
unlisted,navHide,exclude(2.3). - Jeder Knoten bekommt einen Titel (2.1).
- Die Kinder jedes Ordners werden sortiert (2.2).
- Leere Ordner fallen weg.
Ordner sind immer verlinkbar. Gibt es keine index.md, erzeugt Quartz’ Plugin folder-page die
Ordnerseite selbst. Sie steht in derselben Liste und wird wie eine echte behandelt — nur ihr Titel
kommt aus dem Verzeichnisnamen.
Ein Baum je Bau, nicht je Navigation
Der Baum wird einmal berechnet und dann von allen Navigationen gelesen, die dieselben
baumbestimmenden Optionen haben: Sortierung, Ausblenden, include/exclude, Icons. Drei Einträge,
die sich nur in variant, scope oder depth unterscheiden, kosten also einen Baum, nicht drei. Auf
einer mehrsprachigen Site ist es ein Baum je Sprache (8.3).
Daraus folgt eine Eigenschaft, die man kennen sollte: Zwei Navigationen können dieselbe Seite verschieden einordnen, wenn sie verschieden sortieren oder ausblenden. Das ist gewollt — ein Pager nach Datum neben einer Seitenspalte in manueller Reihenfolge ist ein legitimer Aufbau.
Von Baum und Seite zum <nav>
Für jede Seite wählt die Navigation ihren Ausschnitt (Kapitel 3),
markiert die aktuelle Seite mit active und jeden Ordner darüber mit active-trail und schreibt
fertiges HTML mit relativen Links. Im Browser wird nichts nachgebaut. Wer JavaScript abschaltet,
bekommt dieselbe Navigation.
Was im Browser dazukommt
Ein Skript — eines für alle Navigationen der Site — ergänzt, was HTML allein nicht kann:
| Was | Wo es gebraucht wird |
|---|---|
| Offene Ordner merken | persistState (5.1) |
| Menüs beim Überfahren öffnen, bei Escape und Klick daneben schließen | dropdown, mega, flyout (5.2) |
| Panels umlenken, die aus dem Fenster oder aus einer Spalte ragen würden | dieselben drei |
| Seite hinter dem mobilen Menü festhalten, Escape | mobile: offcanvas (6.1) |
| Beim Auswählen im Sprungmenü navigieren | select, mobile: select |
Stylesheet und Skript kommen einmal auf die Site, egal wie viele Navigationen dort stehen.