Product Logo

Theme-Konfiguration

Diese Referenz wird automatisch aus den Theme-Typdefinitionen und Default-Werten generiert.

EigenschaftTypErforderlichDefaultBeschreibung
glossaryPagestringfalseURL-Pfad zur Glossar-Seite (z. B. /glossar). Aktiviert die automatische Verlinkung von Glossarbegriffen im Text.
feedbackFeedbackPropsfalseKonfiguration des Feedback-Formulars. Alle Felder sind in FeedbackProps beschrieben.
feedback.feedbackServerUrlstringtrueURL des Feedback-Servers, an den die Rückmeldungen gesendet werden.
feedback.gitlabProjectIdstringtrueGitLab-Projekt-ID, unter der die Feedback-Issues erstellt werden.
feedback.headlinestringfalseÜberschrift des Feedback-Formulars.
feedback.descriptionstringfalseBeschreibungstext des Feedback-Formulars (nur der Text innerhalb des Absatzes).
feedback.buttonTextstringfalseBeschriftung der Absende-Schaltfläche.
feedback.labelsstring[] | [ ]trueGitLab-Labels, die den erstellten Feedback-Issues zugewiesen werden.
feedback.requiredTextstringtrueHinweistext, der die Kennzeichnung von Pflichtfeldern erläutert.
feedback.fieldsFeedbackFieldstrueKonfiguration der einzelnen Formularfelder (siehe FeedbackFieldConfig).
feedback.fields.emailFeedbackFieldConfigfalseKonfiguration des E-Mail-Feldes (optional).
feedback.fields.messageFeedbackFieldConfigtrueKonfiguration des Nachrichten-Feldes (Pflichtfeld).
feedback.shouldCreateConfidentialIssuebooleanfalseErstellt das GitLab-Issue als vertraulich (confidential), wenn true. Nur im Developer Mode verfügbar.
feedback.notice{ title: string; body: string; link: { href: string; label: string; }; }falseOptionaler Hinweiskasten, der im Feedback-Formular angezeigt wird.
feedback.notice.titlestringtrueTitel des Hinweiskastens.
feedback.notice.bodystringtrueTextkörper des Hinweiskastens.
feedback.notice.link{ href: string; label: string; }trueWeiterführender Link im Hinweiskasten.
feedback.notice.link.hrefstringtrueZiel-URL des Links.
feedback.notice.link.labelstringtrueBeschriftung des Links.
feedback.privacyConsent{ textBeforeLink: string; link: { label: string; href: string; }; textAfterLink: string; }trueDatenschutz-Einwilligung mit Checkbox und Link, die vor dem Absenden bestätigt werden muss.
feedback.privacyConsent.textBeforeLinkstringtrueText vor dem Datenschutz-Link.
feedback.privacyConsent.link{ label: string; href: string; }trueDatenschutz-Link (z. B. zur Datenschutzerklärung).
feedback.privacyConsent.link.labelstringtrueBeschriftung des Datenschutz-Links.
feedback.privacyConsent.link.hrefstringtrueZiel-URL des Datenschutz-Links.
feedback.privacyConsent.textAfterLinkstringtrueText nach dem Datenschutz-Link.
feedback.afterSubmit{ successText: string; errorText: string; buttonLabel?: string; }trueTexte, die nach dem Absenden des Formulars angezeigt werden.
feedback.afterSubmit.successTextstringtrueMeldung bei erfolgreichem Absenden.
feedback.afterSubmit.errorTextstringtrueMeldung bei fehlgeschlagenem Absenden.
feedback.afterSubmit.buttonLabelstringfalseBeschriftung der Schaltfläche im Bestätigungsdialog.
feedback.classNamestringfalseCSS-Klasse für den äußeren Container des Feedback-Formulars.
feedback.headlineClassNamestringfalseCSS-Klasse für die Überschrift.
feedback.descriptionClassNamestringfalseCSS-Klasse für den Beschreibungstext.
feedback.inputClassNamestringfalseCSS-Klasse für die Eingabefelder.
feedback.inputLabelClassNamestringfalseCSS-Klasse für die Feldbeschriftungen.
feedback.textareaClassNamestringfalseCSS-Klasse für mehrzeilige Textfelder.
feedback.checkboxClassNamestringfalseCSS-Klasse für die Checkbox.
feedback.btnClassNamestringfalseCSS-Klasse für die Absende-Schaltfläche.
layoutComponent(props: PropsWithChildren) => ReactNodefalseBenutzerdefinierte Layout-Komponente, die alle Seiten umschließt.
docsRepositoryBasestringfalseVeraltet: Basis-URL des Quell-Repositories. Verwenden Sie stattdessen project.link.
project{ link?: string; icon?: ReactNode | FC; }falseProjekt-Link und optionales Icon für die obere Navigation.
project.linkstringfalseURL zum Quell-Repository (z. B. GitLab-Projektseite).
project.iconReactNode | FCfalseIcon-Komponente, die neben dem Projekt-Link angezeigt wird.
umbrellaFooterbooleanfalsefalseAktiviert den Dachmarken-Footer (openCode / ZenDiS).
umbrellaHeaderbooleanfalsefalseAktiviert den Dachmarken-Header (openCode / ZenDiS).
i18n{ uiElementTranslation?: { [locale: string]: Partial<typeof messages.en>; }; }falseÜbersetzungen für UI-Elemente der Theme-Oberfläche.
i18n.uiElementTranslation{ [locale: string]: Partial<typeof messages.en>; }falseSprachspezifische Übersetzungen der UI-Bezeichnungen, gegliedert nach Locale-Schlüssel.
bannerFCfalseOptionale Banner-Komponente, die oberhalb der gesamten Navigation angezeigt wird.
header{ component?: ReactNode | FC; centerElement?: ReactNode | FC; lowerBadgeLogoPath?: string; }falseKonfiguration der Kopfzeile.
header.componentReactNode | FCfalseEigene Kopfzeilen-Komponente, die die Standard-Kopfzeile ersetzt.
header.centerElementReactNode | FCfalseElement, das in der Mitte der Kopfzeile angezeigt wird (z. B. Suchfeld oder Logo).
header.lowerBadgeLogoPathstringfalsePfad zum Logo im unteren Badge-Bereich der Kopfzeile.
disableSearchbooleantruefalseDeaktiviert die globale Suchfunktion.
hidePrimaryMenubooleantruefalseBlendet das primäre Navigationsmenü in der Kopfzeile aus.
primaryMenu{ title: string; iconEnabled?: boolean; }falseKonfiguration des primären Navigationsmenüs.
primaryMenu.titlestringtrueBezeichnung des primären Menüs.
primaryMenu.iconEnabledbooleanfalseZeigt Icons neben den Menüeinträgen an.
faviconGlyphstringfalseZeichen oder Emoji, das als Favicon verwendet wird.
accessibilityLanguages{ leichteSpracheHref?: string; gebaerdenSprachenHref?: string; }falseLinks zur Leichten Sprache und zur Gebärdensprachen-Version der Website.
accessibilityLanguages.leichteSpracheHrefstringfalseURL zur Leichte-Sprache-Version.
accessibilityLanguages.gebaerdenSprachenHrefstringfalseURL zur Gebärdensprachen-Version.
footer{ component?: ReactNode | FC<{ menu: boolean; }>; links?: Array<{ name: string; href: string; column: string; }>; headingLevel?: "h1" | "h2" | "h3" | "h4" | "h5" | "h6"; logo?: ReactNode | FC; description?: ReactNode | FC; copyright?: ReactNode | FC; }trueKonfiguration des Footers.
footer.componentReactNode | FC<{ menu: boolean; }>false[ref:Footer]Eigene Footer-Komponente, die den Standard-Footer ersetzt.
footer.linksArray<{ name: string; href: string; column: string; }>false[array]Footer-Links mit Name, URL und Spaltenzuordnung.
footer.headingLevel"h1" | "h2" | "h3" | "h4" | "h5" | "h6"falseHTML-Überschriftenebene für Spaltenüberschriften im Footer (z. B. "h2").
footer.logoReactNode | FCfalseLogo-Komponente im Footer.
footer.descriptionReactNode | FCfalsenullBeschreibungstext im Footer (z. B. Kurzbeschreibung der Organisation).
footer.copyrightReactNode | FCfalse[complex]Copyright-Hinweis im Footer.
toc{ disable?: boolean; title?: string; headingLevel?: "h1" | "h2" | "h3" | "h4" | "h5" | "h6"; iconEnabled?: boolean; footer?: ReactNode; }falseKonfiguration des seiteninternen Inhaltsverzeichnisses (TOC).
toc.disablebooleanfalseDeaktiviert das Inhaltsverzeichnis global für alle Seiten.
toc.titlestringfalseÜberschrift des Inhaltsverzeichnisses.
toc.headingLevel"h1" | "h2" | "h3" | "h4" | "h5" | "h6"falseHTML-Überschriftenebene für den TOC-Titel (z. B. "h2").
toc.iconEnabledbooleanfalseZeigt Icons neben den Einträgen im Inhaltsverzeichnis an.
toc.footerReactNodefalseInhalt, der unterhalb der TOC-Einträge angezeigt wird (z. B. ein Link oder Hinweis).
headReactNodefalseZusätzliche Elemente, die in den HTML-<head> der Seite eingefügt werden (z. B. Meta-Tags).
logoReactNode | FCfalse[jsx]Logo-Komponente, die in der Kopfzeile angezeigt wird.
logoTextstringfalse""Text, der neben dem Logo angezeigt wird.
logoLinkboolean | stringtruetrueURL des Logo-Links. Mit false wird der Link deaktiviert.
notFound{ content?: ReactNode | FC; labels?: string; }falseKonfiguration der 404-Fehlerseite.
notFound.contentReactNode | FCfalseEigener Inhalt der 404-Seite. Hat Vorrang vor der eingebauten, übersetzten Beschreibung; ohne Angabe wird die lokalisierte Standardbeschreibung angezeigt.
notFound.labelsstringfalseGitLab-Labels, die beim automatischen Erstellen von Issues für fehlerhafte Links vergeben werden.
search{ component?: ReactNode | FC<{ className?: string; }>; emptyResult?: ReactNode | FC; error?: string | (() => string); loading?: ReactNode | FC; placeholder?: string | (() => string); renderResult?: FC<SearchResultRendererProps>; }trueKonfiguration der Suchfunktion.
search.componentReactNode | FC<{ className?: string; }>false[ref:Flexsearch]Eigene Such-Komponente, die die Standard-Suche ersetzt.
search.emptyResultReactNode | FCfalse[complex]Anzeige, wenn keine Suchergebnisse gefunden wurden.
search.errorstring | (() => string)falseFehlermeldung bei einem Suchfehler.
search.loadingReactNode | FCfalseLadeanzeige während der Suche.
search.placeholderstring | (() => string)falsePlatzhaltertext im Suchfeld.
search.renderResultFC<SearchResultRendererProps>falseEigener Renderer für einzelne Suchergebnis-Einträge. Erhält Titel, Inhalt, Route und den aktuellen Suchbegriff.
sidebar{ disable: boolean; autoCollapse?: boolean; defaultMenuCollapseLevel: number; toggleButton: boolean; }trueKonfiguration der Seitenleiste.
sidebar.disablebooleantruetrueDeaktiviert die Seitenleiste global.
sidebar.autoCollapsebooleanfalseKlappt beim Öffnen eines Bereichs alle anderen automatisch zu.
sidebar.defaultMenuCollapseLevelnumbertrue2Einrückungstiefe, ab der Untermenüs standardmäßig eingeklappt werden.
sidebar.toggleButtonbooleantruetrueZeigt die Schaltfläche zum Ein- und Ausblenden der Seitenleiste an.
editPage{ enabled: boolean; description?: string; repoBaseUrl: string; icon?: "auto" | "edit" | "github" | "opencode" | "gitlab" | "none"; }trueKonfiguration des „Seite bearbeiten"-Links.
editPage.enabledbooleantruefalseAktiviert den „Seite bearbeiten"-Link auf jeder Seite.
editPage.descriptionstringfalseDiese Seite bearbeitenBeschriftung des „Seite bearbeiten"-Links.
editPage.repoBaseUrlstringtrue""Basis-URL zum Quell-Repository (z. B. https://gitlab.example.com/org/repo/-/blob/main/dokument).
editPage.icon"auto" | "edit" | "github" | "opencode" | "gitlab" | "none"falseautoIcon-Stil für den „Seite bearbeiten"-Link. auto wählt anhand der repoBaseUrl automatisch.
themeThemeProviderPropsfalseKonfiguration des Farbschemas (hell/dunkel/System) über next-themes.

FeedbackFieldConfig

EigenschaftTypErforderlichBeschreibung
labelstringtrueBeschriftung, die über dem Feld angezeigt wird.
placeholderstringtruePlatzhaltertext innerhalb des Eingabefelds.
requiredbooleanfalseWenn true, muss das Feld ausgefüllt werden, bevor das Formular abgesendet werden kann.
typeHTMLInputTypeAttribute | "textarea" | "select" | "multiselect"falseEingabetyp des Feldes. Zusätzlich zu den Standard-HTML-Eingabetypen werden "textarea", "select" (Einfachauswahl) und "multiselect" (Mehrfachauswahl) unterstützt. Ohne Angabe wird ein einfaches Textfeld verwendet.
descriptionReactNodefalseOptionaler Hilfetext, der neben dem Feld angezeigt wird.
optionsstring[]falseAuswählbare Werte. Nur relevant, wenn type auf "select" oder "multiselect" gesetzt ist.
allowCustombooleanfalseNur wirksam, wenn type auf "multiselect" gesetzt ist. Fügt der Auswahlliste einen Eintrag „Sonstige“ hinzu; bei dessen Auswahl erscheint ein Freitextfeld, über das Nutzende einen eigenen, nicht in options enthaltenen Wert angeben können. Bei allen anderen Feldtypen wird die Option ignoriert.