Zum Inhalt springen
Blume
Esc
↑↓navigieren↵öffnen⌘Jvorschau
Auf dieser Seite

Navigation

Blume erstellt die Seitenleiste aus deinen Dateien und lässt dich sie dann per Frontmatter, Ordner-Meta oder Konfiguration verfeinern – Breadcrumbs und Gliederungen folgen automatisch.

Blume erstellt deine Seitenleiste aus dem Dateisystem und lässt dich sie dann so viel – oder so wenig – verfeinern, wie du möchtest: Seite für Seite, Ordner für Ordner oder mit einer einzigen expliziten Konfiguration. Breadcrumbs, Zurück-/Weiter-Links und die Gliederung auf der Seite ergeben sich alle aus demselben Modell, ganz ohne Verkabelung.

Die generierte Seitenleiste

Standardmäßig spiegelt die Seitenleiste deinen Inhaltsbaum wider:

  • Ordner werden zu Gruppen, Dateien werden zu Seiten
  • Die Beschriftung einer Seite ist ihr Frontmatter-title; die Beschriftung einer Gruppe ist der lesbar gemachte Ordnername, wobei gängige Akronyme wie API, CLI und SDK großgeschrieben werden (api-reference wird zu „API Reference“)
  • Einträge werden nach numerischem Präfix sortiert, dann alphabetisch, und die index-Seite eines Ordners steht an erster Stelle
  • Ein Ordner mit einer index-Seite verlinkt seine Gruppenzeile auf diese Seite, sodass ein Klick auf den Abschnittsnamen die Landing-Page des Abschnitts öffnet

Für viele Websites reicht das bereits – alles Weitere ist optional.

Seitenbeschriftung, Symbol und Badge

Passe im Frontmatter unter sidebar an, wie eine einzelne Seite in der Seitenleiste erscheint:

sidebar:
  label: Quickstart # override the title in the sidebar
  icon: rocket # an icon from Blume's built-in set
  badge: New # a small label beside the entry
  order: 1 # sort position within its group

Das vollständige Seitenschema findest du unter Frontmatter.

Ordnergruppen

Jeder Ordner wird zu einer Gruppe in der Seitenleiste. Lege eine meta.ts neben die Seiten, um Titel, Symbol und Reihenfolge der Gruppe sowie die Reihenfolge ihrer untergeordneten Einträge festzulegen:

import { defineMeta } from "blume";

export default defineMeta({
  title: "Guides",
  icon: "book-open",
  pages: ["configuration", "theming", "deployment"],
});

Unter Ordner-Meta findest du alle Felder sowie Informationen zur Berechnung von Meta-Daten während des Scans.

Das meta.title eines Ordners und das Frontmatter-title seiner eigenen index-Seite werden unabhängig voneinander aufgelöst – übersetzt du unter i18n das eine und vergisst das andere, entsteht eine korrekte Seitenleiste mit einer veralteten Überschrift auf der Landing-Page selbst. Blume meldet eine BLUME_NAV_INDEX_TITLE_MISMATCH-Warnung, wenn beide auf einer Index-Seite voneinander abweichen, die ihre eigene Zeile in der Seitenleiste ausblendet (sidebar.hidden: true) – dort ist der Ordnertitel die einzige Beschriftung, die die Seite in der Seitenleiste hat. Die Prüfung liest title, das in der Überschrift der Seite angezeigt wird; seo.title ersetzt nur den <title> und zählt daher nicht. Nicht übersetzte Seiten, die aus der Fallback-Sprache ergänzt werden, sind davon ausgenommen – ihr Titel gehört zur Fallback-Sprache, und die Lösung besteht darin, die Seite zu übersetzen, nicht ihr Frontmatter zu bearbeiten.

Wie jede Warnung lässt sie blume validate --strict fehlschlagen. Jede dieser Maßnahmen behebt sie:

  • Ändere das title der Seite oder das meta.title des Ordners, sodass beide übereinstimmen.
  • Behalte den Titel der Seite bewusst bei, indem du ihr sidebar.label auf den Ordnertitel setzt – so, wie jede Seite eine Beschriftung in der Seitenleiste setzt, die von ihrem Titel abweicht.
  • Blende die Index-Zeile wieder ein. Die Seitenleiste zeigt dann beide Titel, sodass du einen Ordnertitel problemlos mit einem anderen Seitentitel kombinieren kannst („CLI“ über „Übersicht“).

Um Seiten zu gruppieren, ohne ein URL-Segment hinzuzufügen, verwende einen in Klammern gesetzten Ordnernamen – siehe Seiten.

Anzeigemodi

navigation.sidebar.display legt fest, wie jede Gruppe in der Seitenleiste dargestellt wird:

navigation: {
  sidebar: {
    display: "flat", // "flat" | "group" | "page"
  },
}
  • flat (Standard) – eine nicht einklappbare Überschrift mit den darunter aufgelisteten Seiten. Seiten, die zu keiner Gruppe gehören, stehen immer zuerst, oberhalb der Gruppenabschnitte, damit sie nicht für untergeordnete Einträge einer Gruppe gehalten werden.
  • group – ein einklappbares <details>-Element pro Gruppe. Gruppen sind standardmäßig zunächst eingeklappt; eine Gruppe, welche die aktuelle Seite enthält, ist immer aufgeklappt, sodass nur der Abschnitt geöffnet ist, in dem du dich befindest. Eine Gruppe, die die einzige Zeile auf der obersten Ebene der Seitenleiste ist – etwa ein Ordner, der alle Seiten umschließt –, ist ebenfalls aufgeklappt, sodass die Seitenleiste nie nur eine einzelne eingeklappte Zeile zeigt. Setze collapsed: false im Ordner-Meta, um eine Gruppe unabhängig davon offen zu erzwingen, oder collapsed: true, um diese einzelne Gruppe eingeklappt zu halten.
  • page – jede Gruppe ist eine einzelne Zeile, deren Chevron die Seitenleiste in ein Unterpanel schiebt, das nur die Einträge dieser Gruppe zeigt, mit einem Zurück-Pfeil oben. Eine Gruppe mit Index-Seite verlinkt den Namen der Zeile auf diese Seite, und bei einer Gruppe ohne Index-Seite schiebt ein Klick an beliebiger Stelle der Zeile das Panel herein. Das Panel ist routen-bewusst, sodass beim direkten Aufruf einer Seite innerhalb der Gruppe sofort dorthin geöffnet wird. Nachdem du den Zurück-Pfeil benutzt hast, bleibt die Zeile des Abschnitts, in dem du dich befindest, hervorgehoben.

Sowohl im group- als auch im page-Modus wird ein Abschnitt, der auf der aktuellen Seite nicht geöffnet ist, aus dem HTML dieser Seite weggelassen und beim ersten Öffnen nachgeladen (er wird bereits vorab geladen, sobald Zeiger oder Fokus seine Zeile erreichen, sodass das Öffnen meist sofort erfolgt, und ein einmal geladener Abschnitt bleibt für den Rest des Besuchs erhalten). Auf einer großen Website macht das den Großteil des Gewichts einer Seite aus: Nur die Zeilen des geöffneten Abschnitts werden mit der Seite ausgeliefert. Die Zeilen sind vorgerenderte Fragmente unter /blume-nav/, daher brauchen sie keinen Server. Lesende ohne JavaScript sehen den geöffneten Abschnitt und die Gruppenzeilen; die Sitemap, die Zurück-/Weiter-Links und der geöffnete Abschnitt halten jede Seite für Crawler erreichbar.

Überschreibungen pro Gruppe

Jede generierte Gruppe kann sich vom globalen Modus abmelden – ganz ohne explizite Seitenleiste. Setze display in der meta.ts des Ordners oder – wenn der Ordner eine index-Seite hat – unter sidebar im Frontmatter dieser Seite, und nur diese eine Gruppe ändert sich:

import { defineMeta } from "blume";

export default defineMeta({
  title: "Client SDKs",
  display: "page",
});
---
title: Client SDKs
sidebar:
  display: page
---

Der effektive Modus einer generierten Gruppe wird nach absteigender Priorität aufgelöst:

  1. sidebar.display im Frontmatter der eigenen index-Seite der Gruppe
  2. display in der meta.ts des Ordners
  3. Das globale navigation.sidebar.display
  4. Der Blume-Standard (flat)

Das display einer Gruppe gilt nur für diese Gruppe – verschachtelte Untergruppen lösen ihren eigenen Wert über dieselbe Kette auf. Eine Gruppe im page-Modus mit einer Index-Seite verlinkt den Namen ihrer Zeile auf diese Seite, sodass ein Klick auf den Namen die Landing-Page mit bereits geöffnetem Unterpanel öffnet, während der Chevron daneben das Panel hereinschiebt, ohne die aktuelle Seite zu verlassen. Der Titel des Panels verlinkt zurück auf die Landing-Page, und die Index-Seite wird als erster Eintrag des Panels aufgeführt, sofern sie nicht ausgeblendet ist. Eine Gruppe im page-Modus ohne Index-Seite hat nichts zu öffnen, daher schiebt ihre gesamte Zeile das Panel herein.

sidebar.display bedeutet an allen anderen Stellen nichts – auf einer Nicht-Index-Seite, auf der eigenen index-Seite des Inhalts-Roots (der Root ist keine Gruppe; verwende navigation.sidebar.display) oder auf jeder Seite, wenn eine explizite Seitenleiste konfiguriert ist (deren Einträge bestimmen den Modus jeder Gruppe) –, daher meldet Blume eine BLUME_SIDEBAR_DISPLAY_IGNORED-Warnung, statt es stillschweigend zu verwerfen. collapsed bleibt spezifisch für den group-Modus; es ist wirkungslos, wenn eine Gruppe zu flat oder page aufgelöst wird.

Eine Gruppe in einer expliziten Seitenleiste überschreibt den globalen Modus mit einem eigenen display, genau wie zuvor.

Verzeichnislisten

Die eigene Seite einer Gruppe kann die übrigen Seiten der Gruppe unterhalb ihres Inhalts auflisten, sodass die Landing-Page eines Abschnitts zugleich als dessen Inhaltsverzeichnis dient. Setze directory in der meta.ts des Ordners:

import { defineMeta } from "blume";

export default defineMeta({
  directory: "card",
});
  • card zeigt jede Seite und jede Untergruppe als Karte mit ihrem Symbol und ihrer Beschreibung.
  • accordion listet die Seiten als Zeilen auf und jede Untergruppe als Abschnitt, der sich zu ihren Seiten aufklappen lässt.
  • none listet nichts auf. Das ist der Standard.

Nur eine Gruppe mit eigener Seite hat einen Ort, an dem die Liste erscheinen kann: die index-Seite eines Ordners oder das root einer expliziten Gruppe. Die Einstellung wird an verschachtelte Ordner vererbt, sodass ein einziges directory in der meta.ts des Inhalts-Roots jedem Abschnitt eine Liste gibt, und ein Ordner kann einen eigenen Wert setzen (einschließlich none), um den geerbten zu überschreiben. Eine explizite Seitenleiste setzt directory auf die gleiche Weise für ihre Gruppen.

Reihenfolge

Wenn die Seitenleiste generiert wird, wird die Reihenfolge nach absteigender Priorität aufgelöst:

Config sidebar

Eine explizite navigation.sidebar ersetzt den generierten Baum vollständig.

Folder meta

Das pages-Array in meta.ts bestimmt die Reihenfolge einer Gruppe.

Frontmatter

sidebar.order auf einer Seite.

File system

Zuerst eine index-Seite, dann numerische Präfixe, dann alphabetisch nach Beschriftung.

Zwei gleichrangige Einträge mit derselben expliziten oder numerischen Reihenfolge werden untereinander alphabetisch sortiert – Blume meldet eine BLUME_DUPLICATE_SIDEBAR_ORDER-Warnung, damit der Gleichstand nicht unbemerkt bleibt.

Ausgeblendete Seiten

Blende eine Seite aus der Seitenleiste – und aus der Zurück-/Weiter-Navigation – aus, während sie weiterhin gebaut und über ihre URL erreichbar bleibt:

sidebar:
  hidden: true

Eine ausgeblendete Seite taucht außerdem weder in der Sitemap noch in llms.txt auf und auch nicht in der Website-Suche, es sei denn, search.indexing.includeHiddenPages ist aktiviert.

Die index-Seite eines Ordners erscheint sowohl als Link der Gruppenzeile als auch als erste Zeile innerhalb der Gruppe. Blende die Index-Seite aus, um nur die verlinkte Überschrift zu behalten: Die Gruppenzeile öffnet weiterhin die Landing-Page, und die Zurück-/Weiter-Links führen weiterhin durch sie hindurch. Da die Navigation weiterhin auf die Seite verlinkt, gilt sie nirgendwo sonst als ausgeblendete Seite: Sie bleibt in der Sitemap, in der Website-Suche und in llms.txt. Dasselbe gilt für die Startseite der Website, die index-Seite im Root: Blendest du sie aus, entfällt ihre Zeile in der Seitenleiste, aber die Root-URL der Website liefert sie weiterhin aus, daher bleibt sie ebenfalls gelistet.

Tabs

Stelle Abschnitte der obersten Ebene als Tabs im Header dar – nützlich, um eine große Website in eigenständige Bereiche zu unterteilen, etwa Adapter, eine API und KI-Leitfäden. Ein Tab wird hervorgehoben, wenn die aktuelle Route unter seinen path fällt:

navigation: {
  tabs: [
    { label: "Adapters", path: "/adapters", icon: "plug" },
    { label: "API", path: "/api", icon: "rocket" },
    { label: "AI", path: "/ai", icon: "sparkles" },
  ],
}

Das optionale icon eines Tabs (ein Name eines eingebauten Symbols, ein Bildpfad bzw. eine Bild-URL oder ein Inline-SVG) erscheint neben seiner Beschriftung – im Header und im mobilen Navigationsmenü.

Eine aktivierte OpenAPI-, AsyncAPI- oder GraphQL-Referenz wird unter ihrer Route eingebunden, fügt aber nicht von sich aus einen Tab hinzu – richte einen Tab auf diese Route, um sie im Header sichtbar zu machen (und, beim nativen Renderer, um ihre Operations-Seitenleiste einzugrenzen), mit einer Beschriftung deiner Wahl:

navigation: {
  tabs: [
    { label: "API", path: "/reference" },
  ],
}

Der path eines Tabs ist sein Abschnittspräfix und dient zugleich als Linkziel. Ein Abschnitt, dessen path keine eigene Seite ist – ein Ordner ohne index.mdx –, würde auf einen 404 verweisen, daher greift der Tab stattdessen auf die erste Seite im Abschnitt zurück. Das gilt auch für einen Tab mit path: "/" auf einer Website ohne index.mdx im Root: Er verlinkt auf die erste Seite in der Seitenleiste. Eine statische benutzerdefinierte Seite am path des Tabs zählt als eigene Seite des Abschnitts: Mit pages/guides.astro landet ein /guides-Tab auf dieser Seite, während der Ordner guides/ seine Seitenleiste füllt. Dasselbe gilt für den generierten Changelog-Index, sodass ein /changelog-Tab die Zeitleiste öffnet statt des neuesten Eintrags.

Setze href, wenn ein Tab woanders landen soll – etwa auf einer bestimmten Seite im Abschnitt:

navigation: {
  tabs: [
    { label: "Guides", path: "/guides", href: "/guides/getting-started" },
  ],
}

Tabs, die kein href setzen, behalten die oben beschriebene Auflösung bei.

Gib einem Tab items, um ihn zu einem Dropdown zu machen. Der Tab selbst verlinkt dann nirgendwohin mehr: Im Header öffnet er ein Menü mit seinen Einträgen, und im mobilen Navigationsmenü klappt er sie an Ort und Stelle auf. Sein path grenzt weiterhin die Seitenleiste ein und markiert den Tab als aktuell, und href gilt nicht. Jeder Eintrag nimmt ein label und einen path sowie optional icon, description und tag entgegen – wie ein Eintrag eines Selektors:

navigation: {
  tabs: [
    { label: "Guides", path: "/guides" },
    {
      label: "SDKs",
      path: "/sdks",
      items: [
        { label: "JavaScript", path: "/sdks/javascript", description: "Node and the browser" },
        { label: "Python", path: "/sdks/python", tag: "Beta" },
      ],
    },
  ],
}

Auf einer i18n-Website kann die label eines Tabs (und die eines Dropdown-Eintrags) statt einer Zeichenkette eine Zuordnung pro Sprache sein – der Eintrag der aktiven Sprache gewinnt, danach der der Standardsprache:

navigation: {
  tabs: [
    { label: { en: "Docs", fr: "Documentation" }, path: "/docs" },
    { label: "CLI", path: "/cli" }, // a plain string renders as-is everywhere
  ],
}

Die Beschriftungen eines Selektors nehmen keine Zuordnung entgegen: Sein label und die Beschriftungen all seiner Einträge sind schlichte Zeichenketten.

Tabs grenzen außerdem die Seitenleiste ein: Wenn die aktuelle Route unter den path eines Tabs fällt, zeigt die Seitenleiste nur die Seiten dieses Abschnitts – /adapters/* listet also die Adapter und sonst nichts. Der Ordner am path eines Tabs wird zum Abschnitt, sodass dafür über die Tabs hinaus keine zusätzliche Konfiguration nötig ist; strukturiere deine Inhalte in einen Ordner pro Tab und richte jeden Tab darauf aus.

Auf einer Route, die unter keinem Tab liegt (oder unter einem Tab, dessen path / ist), zeigt die Seitenleiste die Seiten, die nicht zu einem Tab gehören – der Ordner jedes Tabs wird darin ausgeblendet, da dieser Abschnitt bereits einen eigenen Tab im Header hat. Eine Root-Landing-Page listet also deine losen Seiten der obersten Ebene, während die in Abschnitte gegliederten Inhalte hinter ihrem Tab bleiben – analog zu den Root-Ordnern von Fumadocs. Hat eine Route auf diese Weise keine eigenen Seiten anzuzeigen, wird stattdessen der vollständige Baum gezeigt, damit die Seitenleiste nie leer bleibt.

Selektoren

Zum Wechseln zwischen ganzen Partitionen einer Website – einem Produkt, einer Version oder einer beliebigen gruppierten Menge von Zielen – füge einen selector hinzu. Jeder wird als Dropdown im Header dargestellt und zeigt die Option, deren path zur aktuellen Route passt:

navigation: {
  selectors: [
    {
      kind: "version",
      label: "Version",
      items: [
        { label: "v2 (latest)", path: "/v2", icon: "rocket" },
        { label: "v1", path: "/v1" },
      ],
    },
  ],
}

Jeder Eintrag nimmt ein label, einen path sowie optional icon, description und tag entgegen. kind (dropdown, product, version oder language) ist ein Hinweis darauf, wie der Selektor verwendet wird; alle stellen dasselbe Dropdown dar.

Ist Versionierung konfiguriert, stellt Blume automatisch einen Versions-Selektor dar – deklarierst du hier einen eigenen kind: "version"-Selektor, ersetzt er den automatischen, sodass selbstgebaute Setups weiterhin funktionieren.

Auf Bildschirmen, die zu schmal für die Desktop-Seitenleiste sind, wandern Selektoren, der Versions-Selektor und der Sprachumschalter aus dem Header an den oberen Rand des mobilen Navigationsmenüs, wo jeder die volle Breite des Menüs einnimmt.

Hefte Links an den oberen Rand der Seitenleiste, über alle Abschnitte – ein Blog, ein Changelog, eine Kontakt- oder Supportseite, die immer nur einen Klick entfernt sein sollte. Anders als der generierte Baum sind hervorgehobene Links nicht nach Tab eingegrenzt: Sie erscheinen auf jeder Route und bei jedem Breakpoint.

navigation: {
  featured: [
    { label: "Blog", href: "https://example.com/blog", icon: "newspaper" },
    { label: "Contact", href: "/contact", icon: "headphones" },
  ],
}

Jeder Link nimmt ein label, ein href und optional ein icon entgegen (ein Name eines eingebauten Symbols, ein Bildpfad bzw. eine Bild-URL oder ein Inline-SVG – wie überall sonst auch). Ein href kann überallhin verweisen: Eine externe URL öffnet sich in einem neuen Tab, während eine interne Route (/contact) zur Build-Zeit und von blume doctor gegen deine Seiten geprüft wird und dich warnt, wenn nichts übereinstimmt. Ein Pfad zu einer Datei in public/ (/spec.pdf) oder zu einer Datei, die Blume generiert (/llms.txt), gilt ebenfalls als Treffer.

Explizite Seitenleiste

Für volle Kontrolle listest du explizite Einträge in navigation.sidebar auf – ein bloßes Array ist eine Kurzform für sidebar.items, und die Objektform kombiniert sie mit einem globalen display. Sind Einträge gesetzt, verwendet Blume sie unverändert und überspringt die Generierung aus dem Dateisystem:

navigation: {
  sidebar: [
    "/", // a page, referenced by route
    {
      label: "Guides", // a group
      collapsed: false,
      items: ["/configuration", "/configuration/theming"],
    },
    { label: "GitHub", href: "https://github.com/owner/repo" }, // an external link
  ],
}

Jeder Eintrag ist eine Seitenroute (eine Zeichenkette), eine Gruppe (label + items) oder ein Link (label + href). Gruppen können verschachtelt werden, den globalen display-Modus überschreiben, collapsed starten und eine root-Seite verlinken, welche die Seiten der Gruppe mit einem directory auflisten kann.

Blume warnt dich bei einem Eintrag, den es nicht so darstellen kann, wie er geschrieben ist: bei einer Route, die zu keiner Seite passt (der Eintrag wird weggelassen), bei einem root, das zu keiner Seite passt (sein Link würde auf einen 404 verweisen), oder bei einem Eintrag ohne Route, href, root oder items (wird weggelassen).

Header-Aktionen

navigation.actions platziert schlichte Links im Header, links neben den Symbol-Buttons, und navigation.cta ist der eine gefüllte Button:

navigation: {
  actions: [{ href: "/changelog", label: "Changelog" }],
  cta: { href: "https://example.com/signup", label: "Start free" },
}

Wie bei Tab-Beschriftungen kann ein label hier auf einer mehrsprachigen Website eine Zuordnung von Sprachcode zu Text sein.

Eine Aktion ist nur ein Link, daher listet ein so verlinktes Changelog seine Einträge weiterhin in der Seitenleiste auf. Verlinke es mit einem Tab, um sie dort herauszuhalten.

cta ist mit Absicht Singular – ein Doku-Header hat Platz für genau eine Sache, zu der Lesende aufgefordert werden, und eine Reihe von Buttons fordert zu gar nichts auf. Sekundäre Links gehören in actions – oder in featured, wenn sie stattdessen bei der Seitenleiste sitzen sollen.

Ein http(s)- oder protokollrelatives href öffnet sich in einem neuen Tab; eine Route bleibt im Tab und wird – wie ein featured-Link – zur Build-Zeit gegen deine Seiten geprüft. Eine Seite, die von einer anderen App auf demselben Host ausgeliefert wird (etwa /signup auf dem Produkt), solltest du daher als absolute URL schreiben. actions werden unterhalb des sm-Breakpoints ausgeblendet, wo der Header nur noch Platz für das Logo und den Navigations-Umschalter hat. cta wird dort ebenfalls ausgeblendet – außer auf einer Seite ohne Navigations-Umschalter, etwa einer Landing-Page mit PageLayout ohne Tabs, wo er bleibt, da ihn auf einem Smartphone sonst nichts sichtbar machen kann.

Wenn du github in deiner Konfiguration setzt, zeigt Blume ein GitHub-Symbol im Footer – vor deinen Social-Media-Profilen –, das auf dein Repository verlinkt. Es ist standardmäßig aktiviert; blende es mit navigation.repo aus:

navigation: {
  repo: false, // hide the footer's GitHub link (default: true)
}

Der Link erscheint nur, wenn github konfiguriert ist, sodass Projekte ohne Repository so oder so nicht betroffen sind.

repo nimmt außerdem eine absolute URL entgegen, die das GitHub-Zeichen auf einen beliebigen Ort auf GitHub verweisen lässt:

navigation: {
  repo: "https://github.com/acme",
}

Das ist für ein Projekt gedacht, dessen Doku-Repository privat ist. github steuert den Bearbeiten-Link pro Seite, das GitHub-Zeichen und das Repository im Agenten-Manifest gemeinsam, sodass ein solches Projekt github ungesetzt lassen muss – und eine URL sorgt dafür, dass trotzdem ein Zeichen angezeigt wird, das auf etwas Öffentliches verweist. Eine footer.socials.github-URL tritt an die Stelle des Zeichens, und ein Link auf einen anderen Host gehört in die links des Footers oder in actions.

Diese ergeben sich kostenlos aus dem Seitenleistenbaum – ohne Konfiguration:

  • Breadcrumbs zeigen die übergeordnete Gruppe der aktuellen Seite über dem Titel.
  • Zurück- und Weiter-Links am Fuß jeder Seite folgen der Reihenfolge in der Seitenleiste und überspringen ausgeblendete Seiten. Setze pagination: false im Frontmatter einer Seite, um sie auf dieser Seite wegzulassen.

Auf dieser Seite

Aus den Überschriften jeder Seite – standardmäßig ## und ### – wird automatisch eine Gliederung in der rechten Spalte erzeugt, damit lange Seiten überschaubar bleiben. Setze toc, um den Bereich der Überschriftenebenen zu ändern oder die Gliederung auszuschalten. Auf schmaleren Bildschirmen, wo die rechte Spalte ausgeblendet ist, klappt sie zu einem „Auf dieser Seite“-Dropdown über dem Inhalt zusammen, das auch die Seitenaktionen enthält.

Seitenaktionen

Unter dem Inhaltsverzeichnis zeigt jede Seite eine Reihe von Schnellaktionen. In Fenstern ab 1.280px Breite stehen sie in der rechten Spalte bei der Gliederung. In schmaleren Fenstern und auf Smartphones stehen sie am Ende des „Auf dieser Seite“-Dropdowns über dem Inhalt, das auch auf einer Seite ohne Überschriften erscheint:

  • Auf GitHub bearbeiten – verlinkt direkt auf die Quelldatei. Erscheint, sobald du github in deiner Konfiguration setzt, auf jeder Seite, deren Datei im Repository liegt: Eine Datei, die git ignoriert – etwa eine generierte API-Referenz, die in einen per gitignore ausgeschlossenen Ordner geschrieben wird –, bekommt keinen Bearbeiten-Link, da GitHub keine Datei zum Öffnen hat.
  • Nach oben scrollen – kehrt sanft an den Anfang langer Seiten zurück. Diese Aktion gibt es nur in der rechten Spalte, da das Dropdown ohnehin schon am Anfang der Seite sitzt.

Andere übergeben die Seite an KI-Tools – Als Markdown kopieren und Im Chat öffnen – beschrieben unter Markdown für Agenten.

Feedback findest du stattdessen am Fuß der Seite: eine Ja/Nein-Bewertung „War diese Seite hilfreich?“, die ein feedback-Analytics-Event sendet und kein github benötigt – siehe Seiten-Feedback.

Mit aktiviertem export ermöglicht eine Export-Aktion Lesenden zusätzlich, die Seite als PDF oder EPUB herunterzuladen.

Zuletzt aktualisiert am

War diese Seite hilfreich?