Frontmatter
Konfigurieren Sie Seitentitel, Beschreibungen, Icons, Seitenleistenüberschreibungen und SEO-Metadaten mit dem YAML-Frontmatter-Block jeder MDX-Datei.
Jede MDX-Datei beginnt mit einem YAML-Block zwischen ----Markierungen. Diese Metadaten steuern den Seitentitel, das Erscheinungsbild der Seitenleiste und die Darstellung der Seite beim Teilen in sozialen Medien oder in Suchergebnissen.
Grundlegendes Frontmatter
Jede Seite benötigt mindestens einen Titel:
---
title: Getting Started
description: Learn the basics in 5 minutes
---Verfügbare Felder
Erforderlich
| Feld | Typ | Beschreibung |
|---|---|---|
title | string | Seitentitel, der in der Navigation und im Browser-Tab angezeigt wird |
Empfohlen
| Feld | Typ | Beschreibung |
|---|---|---|
description | string | Kurze Zusammenfassung für SEO und Suchergebnisse (50–160 Zeichen) |
Optional
| Feld | Typ | Standard | Beschreibung |
|---|---|---|---|
icon | string | - | Font Awesome-Icon, das neben dem Seitentitel in der Seitenleistennavigation angezeigt wird |
sidebarTitle | string | title | Kürzerer Titel für die Seitenleistennavigation |
mode | string | - | Auf "wide" setzen, um ein Layout mit voller Breite zu verwenden |
hideFooter | boolean | false | Den Social-Footer auf dieser Seite ausblenden |
rss | boolean | false | RSS-Feed-Generierung aus Update-Komponenten auf dieser Seite aktivieren |
private | boolean | false | Das Seitenpasswort zum Anzeigen dieser Seite voraussetzen. Wenn dies auf einer beliebigen Seite aktiviert wird, wird beim nächsten Build der Modus für bestimmte Seiten aktiviert. |
public | boolean | false | Diese Seite vom Passwortschutz ausnehmen (wird verwendet, wenn die gesamte Website über auth.password.enabled geschützt ist). Hat Vorrang vor private: true, wenn beide Werte gesetzt sind. |
SEO und soziale Medien
Steuern Sie, wie die Seite in Suchergebnissen und Social-Previews erscheint. Legen Sie diese als flache Schlüssel auf oberster Ebene oder in einem verschachtelten seo:-Block fest. Beides funktioniert, und seitenbezogene Werte überschreiben die seo.metatags-Standardwerte aus Ihrer docs.json.
| Feld | Typ | Standard | Beschreibung |
|---|---|---|---|
keywords | string[] | - | Suchbegriffe, die als <meta name="keywords">-Tag ausgegeben werden |
canonical | string | auto | Canonical-URL für diese Seite, die die automatisch generierte URL überschreibt |
noindex | boolean | false | Diese Seite von Suchmaschinen und der Sitemap ausschließen |
og:* / twitter:* | string | - | Open-Graph- und Twitter/X-Tags für Social-Previews (z. B. og:title, og:image, twitter:card) |
seo | object | - | Verschachtelter Block mit den oben genannten sowie beliebigen benutzerdefinierten Meta-Tags |
---
title: API Reference
description: REST endpoints and authentication
"og:image": /images/api-card.png
"twitter:card": summary_large_image
canonical: https://docs.acme.com/api-reference
---Unter SEO-Optimierung finden Sie die vollständige Liste der unterstützten Tags und Beispiele.
Fügen Sie nach einem Build die Seiten-URL in das kostenlose Tool OpenGraph Preview ein, um zu sehen, wie diese Tags auf X, Facebook, LinkedIn, Slack, Discord und weiteren Plattformen dargestellt werden.
Beispiele
Standard-Dokumentationsseite
---
title: Authentication
description: Secure your API with OAuth 2.0 and API keys
icon: lock
---Langer Titel mit Überschreibung der Seitenleiste
---
title: Configuring Single Sign-On with SAML 2.0
sidebarTitle: SSO Setup
description: Set up enterprise SSO for your organization
---Der vollständige Titel wird auf der Seite angezeigt, während sidebarTitle für eine übersichtliche Navigation sorgt.
Layout mit voller Breite
---
title: API Reference
description: Complete API documentation
mode: wide
---Der breite Modus entfernt das Inhaltsverzeichnis und erweitert den Inhalt auf die volle Breite. Er eignet sich für API-Referenzseiten oder Inhalte mit breiten Tabellen.
Footer ausblenden
---
title: Custom Landing
description: A focused landing page experience
hideFooter: true
---Verwenden Sie hideFooter für Landingpages, Changelog-Seiten oder jede Seite, auf der Sie einen aufgeräumteren unteren Bereich ohne Social-Links wünschen.
SEO-Best Practices
Ihr Titel erscheint in:
- Browser-Tabs
- Suchmaschinenergebnissen
- Seitenleisten-Navigation
- Geteilten Beiträgen in sozialen Medien
Halten Sie Titel unter 60 Zeichen. Platzieren Sie wichtige Suchbegriffe am Anfang.
# Good - clear and keyword-rich
title: Deploy to Production
# Avoid - vague or too long
title: How to Deploy Your Application to Production ServersBeschreibungen erscheinen in Suchergebnissen und Social-Previews. Streben Sie 50–160 Zeichen an, die:
- den Seiteninhalt zusammenfassen
- relevante Suchbegriffe enthalten
- Nutzer zum Klicken anregen
# Good - actionable and specific
description: Deploy your docs to production in under 2 minutes with zero configuration
# Avoid - generic or missing
description: Documentation pageIcons helfen Nutzern, die Navigation schnell zu überblicken. Verwenden Sie für verwandte Seiten dasselbe Icon:
| Thema | Empfohlenes Icon |
|---|---|
| Getting started | rocket |
| Authentication | lock |
| API reference | code |
| Settings | gear |
| Billing | credit-card |
Durchsuchen Sie die Icons bei Font Awesome.
Validierung
Jamdesk validiert das Frontmatter beim Build. Häufige Fehler:
Error: Page "api/auth.mdx" is missing required field: titleLösung: Fügen Sie das Feld title zu Ihrem Frontmatter hinzu.
Error: Invalid frontmatter in "guide.mdx": unexpected tokenLösung: Prüfen Sie:
- Fehlende Anführungszeichen bei Zeichenfolgen mit Sonderzeichen
- Falsche Einrückung
- Fehlende Doppelpunkte nach Schlüsseln
Fügen Sie den Block zwischen den ----Markierungen in den kostenlosen YAML Validator ein, um die Zeile und Spalte des Fehlers zu ermitteln.