8.3 – Weitere Rezepte

Den Explorer ersetzen

  - source: "@quartz-community/explorer"
    enabled: false
  - source: github:boxi-os/quartz-navigations
    enabled: true
    options:
      variant: accordion
      folderClick: link
      persistState: true
      stripNumericPrefix: true
      mobile: offcanvas
      id: explorer
    layout:
      position: left
      priority: 30

Wie der Explorer, aber mit Ordnerzeilen, die auf ihre Seite führen, einer eigenen Reihenfolge (2.2) und einem Burger-Menü auf dem Smartphone. Die feste id hält das Gedächtnis über spätere Optionsänderungen hinweg.

stripNumericPrefix nur, wenn die Titel nicht selbst mit einer Nummer beginnen (2.1).

Ein Blog nach Datum

  - source: github:boxi-os/quartz-navigations
    enabled: true
    options:
      variant: pager
      rootPath: blog
      sort: date
      sortDirection: desc
      ariaLabel: Neuerer und älterer Beitrag
      id: blog-pager
    layout:
      position: afterBody
      priority: 10

Nur unter blog sichtbar, das Neueste zuerst. Beachten: Mit desc ist „Zurück“ der neuere Beitrag, „Weiter“ der ältere — die Reihenfolge der Liste, nicht die der Zeit. Beiträge ohne Datum stehen am Ende. Eine Seitenspalte in manueller Reihenfolge verträgt sich damit (1.3).

Mehrsprachige Sites

Mit quartz-multilanguage zeigt ein Eintrag auf jeder Seite den Baum ihrer Sprache, ohne weitere Option:

  - source: github:boxi-os/quartz-navigations
    enabled: true
    options:
      variant: accordion
      id: navigation
    layout:
      position: left
      priority: 30

Das gilt für alle vier Aufbauten, die quartz-multilanguage kennt:

Aufbau	Beispiel
Sprachordner	de/docs/setup.md, en/docs/setup.md
Standardsprache in der Wurzel	docs/setup.md, en/docs/setup.md
Sprachsuffix im Dateinamen	docs/Setup.md, docs/Setup.en.md
Sprache im Frontmatter	blog/hallo.md mit lang: de, blog/hello.md mit lang: en

quartz-multilanguage legt an jede Seite ihre Sprache und einen Pfad ohne Sprachordner oder Suffix: Aus en/docs/setup und docs/setup.en wird docs/setup. Nach diesem Pfad ordnet die Navigation die Seiten ein, verlinkt aber die echten. Erzeugte Ordnerseiten, die keine Sprache tragen, kommen über die Seiten daneben in die richtige Sprache.

• Pfade in den Optionen sind sprachneutral. rootPath: docs, order, nodeIcons und include/exclude gelten für jede Sprache gleich. include und exclude treffen zusätzlich den echten Pfad; exclude: [en] lässt also die englischen Seiten weg.
• Die Wörter des Plugins und die alphabetische Sortierung folgen der Seite (7.3, 2.2).
• Eigene Texte nicht. title und ariaLabel stehen in jeder Sprache gleich da. Wer eine Überschrift braucht, legt je Sprache einen Eintrag mit fester language an (unten).
• Die Startseite eines Sprachordners (de/index.md) gewinnt gegen eine index.md in der Wurzel.

Die Option language

Wert	Wirkung
auto (Vorgabe)	der Baum in der Sprache der aktuellen Seite
ein Sprachcode wie de oder en-US	immer der Baum dieser Sprache; en-US findet Seiten mit en
all	keine Sprachen: ein Baum mit allen Seiten, Sprachordner als Ordner — das Verhalten bis Version 0.2

Ein Code, den keine Seite trägt, ergibt keine Navigation und eine Meldung (9.2). Seiten, die zu mehreren oder zu keiner Sprache gehören — eine Ordnerseite, die sich Suffix-Seiten teilen, Tag-Seiten —, bekommen die Standardsprache, so wie quartz-multilanguage für sie entscheidet (9.3).

Eine Überschrift je Sprache

Ein Kapitelbaum in der rechten Spalte, mit der Überschrift „In diesem Kapitel“ auf deutschen und „In this chapter“ auf englischen Seiten:

  - source: github:boxi-os/quartz-navigations
    enabled: true
    options:
      variant: tree
      language: de
      scope: section
      showScopeRoot: true
      title: In diesem Kapitel
      mobile: hidden
      id: kapitel-de
    layout:
      position: right
      priority: 5

Der englische Eintrag unterscheidet sich in language: en, in title und id.

• Zwei Einträge, weil title Text ist. Die Wörter des Plugins übersetzt die Navigation, eine eigene Überschrift nicht.
• language: de zeigt immer den deutschen Baum. Auf einer englischen Seite steht die Seite darin nicht, scope: section findet kein Kapitel, und der Eintrag erscheint nicht (3.1). Genauso verschwindet der englische auf deutschen Seiten — auf jeder Seite steht also genau einer.
• scope: section zeigt das Kapitel, in dem die Seite liegt; showScopeRoot setzt den Kapitelnamen als Link darüber.

Bis zum 24. September 2026 stand genau dieser Baum auf dieser Website. Er ist dem Menü der Vorlage gewichen, das das Kapitel der aktuellen Seite selbst aufklappt (8.1).

Einträge je Sprachordner aus Version 0.2

Bis Version 0.2 brauchte jede Sprache ihren Eintrag, mit rootPath: en oder exclude: [en]. Solche Einträge funktionieren weiter: Ein rootPath, der einen Sprachordner nennt, zeigt den Baum dieser Sprache ab dem Ordner, und mit hideOutsideRoot nur auf Seiten darin. include: [en] wirkt genauso. Nötig sind die getrennten Einträge aber nur noch für eigene Texte.

Bereiche als Reiter über dem Text

  - source: github:boxi-os/quartz-navigations
    enabled: true
    options:
      variant: tabs
      align: full
      mobile: select
      ariaLabel: Bereiche
      id: reiter
    layout:
      position: beforeBody
      priority: 5

Die Bereiche als Reiter über die ganze Breite, die Seiten des aktiven Bereichs in der zweiten Zeile. Auf dem Smartphone ein Sprungmenü statt zweier Zeilen, die umbrechen.

Ein Sprungmenü nur auf dem Smartphone

  - source: github:boxi-os/quartz-navigations
    enabled: true
    options:
      variant: tree
      depth: 2
      mobile: select
      title: Inhalt
      id: inhalt
    layout:
      position: left
      priority: 30

Auf dem Desktop ein Baum in der Spalte, auf dem Smartphone ein einzelnes Auswahlfeld, das kaum Platz braucht. Der title steht in beiden Fassungen darüber.

Eine Sitemap nur für einen Teil der Site

  - source: github:boxi-os/quartz-navigations
    enabled: true
    options:
      variant: columns
      rootPath: docs
      hideOutsideRoot: false
      depth: 2
      title: Dokumentation
      id: doku-sitemap
    layout:
      position: footer
      priority: 10

hideOutsideRoot: false zeigt die Dokumentation auf jeder Seite der Site in der Fußzeile, nicht nur innerhalb von docs (3.2).