Dokumentationsnavigation konfigurieren

Gliedere den generierten Content-Baum in flache Sidebar-Bereiche und -Gruppen.

Die Navigation entsteht aus dem Content-Baum. Verwende .navigation.yml für die Ordnerstruktur und verschachteltes Frontmatter für kürzere Seitennamen; pflege kein separates Sidebar-Array.

Hauptbereich erstellen

Markiere den ersten Ordner eines Bereichs mit sidebar: section:

content/de/1.dokumentation/1.erste-schritte/.navigation.yml

title: Dokumentation
icon: lucide:book-open
sidebar: section

Ein Bereich wird zur Hauptauswahl im Sidebar-Umschalter. Er enthält seine Unterseiten und die nachfolgenden Gruppen auf derselben Ebene bis zum nächsten Ordner, der als Bereich markiert ist.

Flache Gruppen hinzufügen

Verwende sidebar: group für einen benannten Satz Seiten innerhalb des aktuellen Bereichs:

content/de/1.dokumentation/2.konzepte/.navigation.yml

title: Konzepte
icon: lucide:boxes
sidebar: group

content/de/1.dokumentation/3.inhalte/.navigation.yml

title: Inhalte schreiben
icon: lucide:pen-line
sidebar: group

Gruppen erzeugen Überschriften, keine weitere einklappbare Navigationsebene. Füge eine index.md nur hinzu, wenn der Ordner eine echte Landingpage braucht. Ohne Indexseite bleibt die Gruppe strukturell und zeigt ihre Unterseiten direkt unter der Überschrift.

Seitenbezeichnung kürzen

Lass den vollständigen Seitentitel für Suchergebnisse aussagekräftig und lege unter navigation eine kürzere Sidebar-Bezeichnung fest:

content/de/1.dokumentation/3.inhalte/1.inhalte-schreiben.md

---
title: Dokumentationsinhalte schreiben
description: Strukturiere Markdown-Seiten für gute Lesbarkeit und vorhersehbare Navigation.
navigation:
  title: Inhalte schreiben
  icon: lucide:file-pen-line
---

Verwende verschachteltes YAML. Ein gepunkteter Schlüssel wie navigation.title bleibt ein wörtliches Feld und ändert die generierte Bezeichnung nicht.

Sidebar-Anzeige festlegen

Der Content-Baum definiert die Bereiche. Die App-Konfiguration ändert nur, wie Leser zwischen ihnen wechseln:

app/app.config.ts

export default defineAppConfig({
  ginkoDocs: {
    site: {
      docsSidebarSwitcher: "tabs",
    },
  },
});

Wähle 'tabs', 'dropdown' oder 'list'. Die Einstellung erstellt, versteckt oder sortiert keine Inhalte.