Jede Seite ist eine MDX-Datei, die Markdown-Inhalte mit React-Komponenten kombiniert und es Ihnen ermöglicht, umfangreiche, interaktive Dokumentation zu erstellen.

Seitenmetadaten

Jede Seite beginnt mit Frontmatter, den YAML-Metadaten, die am Anfang einer Datei von --- eingeschlossen werden. Diese Metadaten legen fest, wie Ihre Seite angezeigt wird und sich verhält. Verwenden Sie Metadaten, um Folgendes zu steuern:
  • Seitentitel und -beschreibungen
  • Sidebar-Titel, Symbole und Tags
title
string
required
Der Titel Ihrer Seite, der in der Navigation und in Browser-Tabs angezeigt wird.
description
string
Eine kurze Beschreibung dessen, was diese Seite behandelt. Erscheint unter dem Titel und verbessert die SEO.
sidebarTitle
string
Ein kurzer Titel, der in der Sidebar-Navigation angezeigt wird.
icon
string
Das anzuzeigende Icon.Optionen:
  • Name eines Font Awesome-Icons
  • Name eines Lucide-Icons
  • JSX-kompatibler SVG-Code in geschweiften Klammern
  • URL zu einem extern gehosteten Icon
  • Pfad zu einer Icon-Datei in deinem Projekt
Für benutzerdefinierte SVG-Icons:
  1. Konvertiere dein SVG mit dem SVGR-Konverter.
  2. Füge deinen SVG-Code in das SVG-Eingabefeld ein.
  3. Kopiere das vollständige <svg>...</svg>-Element aus dem JSX-Ausgabefeld.
  4. Umschließe den JSX-kompatiblen SVG-Code mit geschweiften Klammern: icon={<svg ...> ... </svg>}.
  5. Passe height und width nach Bedarf an.
iconType
string
Der Iconstil von Font Awesome. Wird nur mit Font Awesome-Icons verwendet.Optionen: regular, solid, light, thin, sharp-solid, duotone, brands.
tag
string
Ein Tag, das neben Ihrem Seitentitel in der Sidebar angezeigt wird.
Example YAML frontmatter
---
title: "About frontmatter"
description: "Frontmatter is the metadata that controls how your page appears and behaves"
sidebarTitle: "Frontmatter"
icon: "book"
tag: "NEW"
---

Seitenmodus

Steuern Sie mit der Einstellung mode, wie Ihre Seite dargestellt wird.

Standard

Ist kein Modus definiert, wird ein Standardlayout mit Seitenleiste für die Navigation und einem Inhaltsverzeichnis verwendet.
---
title: "Standardseitentitel"
---

Breit

Der breite Modus blendet das Inhaltsverzeichnis aus. Das ist nützlich für Seiten ohne Überschriften oder wenn Sie den zusätzlichen horizontalen Platz nutzen möchten. Der breite Modus ist in allen Themes verfügbar.
---
title: "Breiter Seitentitel"
mode: "wide"
---

Benutzerdefiniert

Der benutzerdefinierte Modus bietet ein minimalistisches Layout, das alle Elemente außer der oberen Navigationsleiste entfernt. Er dient als leere Leinwand, um Landingpages oder andere individuelle Layouts zu erstellen, bei denen nur minimale Navigationselemente gewünscht sind. Der benutzerdefinierte Modus ist für alle Themes verfügbar.
---
title: "Custom page title"
mode: "custom"
---

Rahmen

Der Rahmenmodus bietet ein Layout ähnlich dem benutzerdefinierten Modus, behält jedoch die Seitenleisten-Navigation bei. Dieser Seitenmodus erlaubt benutzerdefiniertes HTML und Komponenten, während die standardmäßige Navigation erhalten bleibt. Der Rahmenmodus ist nur für die Themes Aspen und Almond verfügbar.
---
title: "Frame page title"
mode: "frame"
---

Zentriert

Der zentrierte Modus entfernt die Seitenleiste und das Inhaltsverzeichnis und zentriert den Inhalt. Das ist nützlich für Changelogs oder andere Seiten, auf denen du den Inhalt hervorheben möchtest. Der zentrierte Modus ist für die Themes „Mint“ und „Linden“ verfügbar.
---
title: "Center page title"
mode: "center"
---

API-Seiten

Erstellen Sie interaktive API-Spielwiesen, indem Sie in Ihrem Frontmatter die API-Spezifikation über api oder openapi hinzufügen.
---
openapi: "GET /endpoint"
---
Erfahren Sie mehr über das Erstellen von API-Dokumentationen. Verlinken Sie externe Seiten direkt über Ihre Navigation mit den url-Metadaten.
---
title: "npm Package"
url: "https://www.npmjs.com/package/mint"
---

Suchmaschinenoptimierung

Die meisten SEO-Meta-Tags werden automatisch generiert. Sie können SEO-Meta-Tags auch manuell festlegen, um die SEO Ihrer Website, das Teilen in sozialen Netzwerken und die Browserkompatibilität zu verbessern.
Meta-Tags mit Doppelpunkten müssen in Anführungszeichen stehen.
---
"twitter:image": "/images/social-preview.jpg"
---
Siehe SEO für vollständige Optionen zu SEO-Metadaten.

Interne Such-Keywords

Verbessern Sie die Auffindbarkeit einer bestimmten Seite in der integrierten Suche, indem Sie keywords in den Metadaten angeben. Diese Keywords erscheinen nicht im Seiteninhalt oder in den Suchergebnissen, aber wenn Nutzer danach suchen, wird ihnen die Seite als Ergebnis angezeigt.
---
keywords: ['configuration', 'setup', 'getting started']
---