--- title: "Design: Wie Discussions dem Design und den Schriftarten Ihrer Website folgt" description: "Referenz zum Aussehen der Webparts Vitextra Discussions und Discussions Activity: wie das SharePoint-Websitedesign in CSS-Variablen des Webparts kopiert wird, welche Designslots Text, Links, Schaltflächen, Trennlinien und Badges färben, Abschnittshintergründe und Abschnitte in voller Breite, die Websiteschriftart, die Microsoft Teams-Designs „Standard“ und „Dunkel“, Sprachen mit Schreibrichtung von rechts nach links, die Sprachen der Benutzeroberfläche und was nicht angepasst werden kann." url: https://vitextra.com/de/support/kb/10424 language: de published: 2026-11-02 modified: 2026-11-01 products: - "Discussions" author: "Lidija Reising" tags: ["Discussions Design", "SharePoint Websitedesign Webpart", "Designvarianten Abschnittshintergrund", "Websiteschriftart Webpart", "Teams dunkles Design Webpart", "RTL Diskussionsforum", "Fluent UI Designslots", "Vitextra Discussions Branding"] --- # Design: Wie Discussions dem Design und den Schriftarten Ihrer Website folgt Referenz zum Aussehen der Webparts Vitextra Discussions und Discussions Activity: wie das SharePoint-Websitedesign in CSS-Variablen des Webparts kopiert wird, welche Designslots Text, Links, Schaltflächen, Trennlinien und Badges färben, Abschnittshintergründe und Abschnitte in voller Breite, die Websiteschriftart, die Microsoft Teams-Designs „Standard“ und „Dunkel“, Sprachen mit Schreibrichtung von rechts nach links, die Sprachen der Benutzeroberfläche und was nicht angepasst werden kann. ## Überblick Die [Discussions](https://vitextra.com/de/products/discussions)-Webparts haben keine eigenen Farb- oder Schriftarteinstellungen. Stattdessen übernehmen sie das Design der Seite, auf der sie platziert sind – das Websitedesign, den Hintergrund des Abschnitts und die Schriftart der Website – und das Microsoft Teams-Design, wenn sie als Registerkarte oder persönliche App laufen. So sieht ein Board ohne jede Konfiguration aus wie der Rest des Intranets und bleibt lesbar, wenn sich das Websitedesign ändert. Dieser Artikel beschreibt genau, welche Teile des Designs wo verwendet werden, damit Sie wissen, was Sie erwartet, wenn Sie das Aussehen einer Website ändern. ## Wie das Design zum Webpart gelangt Wenn eine Seite gerendert wird, übergibt SharePoint Framework dem Webpart das aktuelle Design – das Websitedesign oder, innerhalb eines Seitenabschnitts mit eigenem Hintergrund, die Designvariante dieses Abschnitts. Das Webpart kopiert einen festen Satz von **Designslots** in benutzerdefinierte CSS-Eigenschaften seines Stammelements (`--bodyText`, `--link`, `--primaryButtonBackground` und so weiter), und sein Stylesheet verweist auf diese Eigenschaften. Sobald sich das Design ändert – ein Websitebesitzer wählt ein anderes Design, ein Seitenautor ändert einen Abschnittshintergrund, Teams wechselt zu Dunkel – rendert SharePoint das Webpart neu, und die Eigenschaften werden erneut geschrieben. Beide Webparts sind mit Fluent UI gebaut, sodass die Standardsteuerelemente auf der Seite (die Ansichts-Registerkarten, Dropdownlisten, das Suchfeld, Schaltflächen, die Befehlsleiste, Meldungsleisten) von Fluent UI selbst gestaltet werden; die benutzerdefinierten Eigenschaften decken die Teile ab, die das Produkt selbst zeichnet – Themenzeilen, Badges, den Antwortbaum, den Editor. ![Das Board unter zwei Websitedesigns](https://static.vitextra.com/articles/10424/site-themes-de.png) *Das Board unter zwei Websitedesigns* ## Designslots und wo sie verwendet werden Das Webpart kopiert die folgenden Slots des Designs. Die Tabelle führt die in der Benutzeroberfläche sichtbaren auf; einige weitere werden für Fluent UI-Steuerelemente kopiert (die Akzent- und Primärschaltflächenzustände, Kartenschatten, deaktivierte Rahmen, Schaltflächenhintergrund und -text, `neutralSecondary`). | Designslot | Verwendet für | |---|---| | `bodyText` | Thementitel, Beitragstext, den Webpart-Titel, den Text des Bildschirms „Not Configured“ | | `bodySubtext` | Metadatenzeilen (Autor, Zeit, Kategorie), Auszüge, Zähler, Platzhalter, Zitate | | `bodyBackground` | Den Editorbereich | | `bodyStandoutBackground` | Die Hover-Farbe von Themenzeilen, den Kreis des Typsymbols, neutrale Badges, die Editor-Symbolleiste, Codeblöcke, das markierte Element in der Erwähnungsliste | | `bodyFrameDivider` | Die Linien zwischen Themenzeilen, den Rahmen des Thementexts, den linken Rand verschachtelter Antworten, den Editorrahmen, Zitatränder, das Titelfeld im Bearbeitungsmodus | | `link`, `linkHovered` | Links in Beiträgen, die Hover-Farbe von Thementiteln, den Fokusrahmen des Editors | | `accent` | Das Typsymbol von Themen, die Schaltfläche **Like**, nachdem der aktuelle Benutzer sie gedrückt hat | | `primaryButtonBackground`, `primaryButtonBackgroundHovered`, `primaryButtonText`, `primaryButtonBorder` | **New topic**, **Post**, **Create board** und andere primäre Schaltflächen | | `successBackground`, `successIcon`, `successText` | Die Badges *Answered* und *Accepted answer*, das Symbol beantworteter Fragen, den Hintergrund der akzeptierten Antwort | | `infoBackground`, `infoIcon` | Die Badges *Question* und *Awaiting approval*, die Markierung ausstehender Elemente | | `errorBackground`, `errorText` | Das Badge mit der Anzahl der Meldungen in der Moderationswarteschlange | Die Namen sind die Slots des Fluent UI-Designs, dieselben, die SharePoint aus der Primärfarbe des Websitedesigns ableitet. Ein mit dem Theme Generator erstelltes benutzerdefiniertes Websitedesign setzt sie alle, sodass jedes Design – nicht nur die integrierten – das Board einheitlich färbt. ## Abschnittshintergründe und Abschnitte in voller Breite Beide Webparts deklarieren die Unterstützung von **Designvarianten**. Wenn ein Seitenautor einem Abschnitt einen Hintergrund gibt (**Abschnittshintergrund**: *Neutral*, *Weich*, *Kräftig*), erhält das Webpart die Variante für diesen Hintergrund und färbt sich um – auf einem *kräftigen* Hintergrund wird der Text hell, und die Trennlinien folgen. Das Webpart **Discussions** unterstützt zusätzlich **Abschnitte in voller Breite** von Kommunikationswebsites; das Webpart **Discussions Activity** ist für schmale Spalten gedacht und tut das nicht. ![Die Webparts auf Abschnitten mit unterschiedlichen Hintergründen](https://static.vitextra.com/articles/10424/section-backgrounds-de.png) *Die Webparts auf Abschnitten mit unterschiedlichen Hintergründen* ## Die Websiteschriftart Wenn die Website eine benutzerdefinierte Schriftart verwendet (**Aussehen ändern → Schriftart** auf einer Website oder eine über das SharePoint Brand Center festgelegte Markenschriftart), veröffentlicht SharePoint sie auf der Seite als CSS-Variable `--fontFamilyCustomFont100`. Das Webpart liest diese Variable und wendet die Schriftart auf alles an, was es zeichnet – Titel, Zeilen, Beiträge und den Editor. Ohne benutzerdefinierte Schriftart ist die Variable leer, und das Webpart erbt die Schriftart der Seite, also Segoe UI in SharePoint. Codeblöcke verwenden immer einen Monospace-Stapel (Consolas, Courier New). 📝 **Hinweis** Der Bildschirm **Not Configured**, der angezeigt wird, während ein Board erstellt oder ausgewählt wird, verwendet den Standardstapel Segoe UI statt der Websiteschriftart. Alles, was Leser nach der Konfiguration des Boards sehen, folgt der Websiteschriftart. ## Microsoft Teams Als Kanalregisterkarte oder persönliche App liest das Webpart das Design des Teams-Clients statt eines SharePoint-Designs: | Teams-Design | Was das Webpart verwendet | |---|---| | **Standard** (hell) | Eine feste helle Palette passend zu Teams: dunkler Text, blaue Links und Schaltflächen, helle Trennlinien | | **Dunkel** | Eine feste dunkle Palette: weißer Text, durchscheinend weiße Links und Akzente, dunkelgraue Hintergründe und Trennlinien | | **Hoher Kontrast** | Die helle Palette | Der Wechsel erfolgt sofort: Das Ändern des Teams-Designs in den Clienteinstellungen rendert die Registerkarte neu. In Teams wird das Websitedesign der zugrunde liegenden SharePoint-Website nicht verwendet, sodass ein Board in jedem Team gleich aussieht, unabhängig vom Design der Website. Das Hinzufügen des Webparts zu Teams ist in [KB10393. So fügen Sie Discussions zu Microsoft Teams hinzu](https://vitextra.com/de/support/kb/10393) beschrieben. ## Sprachen mit Schreibrichtung von rechts nach links Wenn die Sprache der Website eine Sprache mit Schreibrichtung von rechts nach links ist (Arabisch, Hebräisch), setzt das Webpart die Textrichtung seines Stammelements auf rechts nach links: Symbolleiste, Zähler, Antwortbaum und Editor werden entsprechend gespiegelt. Die Richtung folgt der Websitesprache, nicht der Browsersprache. ## Sprache der Benutzeroberfläche und Datumsangaben Die Beschriftungen des Webparts – Ansichten, Schaltflächen, Badges, Spaltennamen der von ihm erstellten Listen – sind auf **Englisch** und **Russisch** verfügbar; die Benutzeroberfläche folgt der Sprache der Website (der SharePoint-Benutzeroberflächensprache des Benutzers), mit Englisch als Fallback für jede andere Sprache. Relative Zeitangaben in der Themenliste und in Threads (*3 hours ago*) werden auf russischen Websites auf Russisch und sonst auf Englisch angezeigt. Die Texte der Themen und Antworten sind natürlich das, was die Autoren geschrieben haben. Seit Version 26.10.3 zeigt das Daraufzeigen auf die relative Zeitangabe bei einem Thema und bei jeder Antwort das vollständige Datum mit Uhrzeit im langen lokalisierten Format an, in der Zeitzone Ihres Browsers – zum Beispiel *October 29, 2026 10:15 AM* auf englischen Websites und *29 октября 2026 г., 10:15* auf russischen Websites. Die relativen Zeitangaben in der Themenliste, im Webpart Discussions Activity und in der Moderationswarteschlange haben keinen solchen Tooltip. ## Was nicht geändert werden kann - Es gibt im Eigenschaftenbereich keine Farbauswahl, keine Designüberschreibung und keine Option für benutzerdefiniertes CSS; Farben lassen sich nur über das Websitedesign oder den Abschnittshintergrund ändern. - Die Symbole der Thementypen (eine Sprechblase für Diskussionen, ein Fragezeichen für Fragen, ein Häkchen für beantwortete Fragen) und die Badge-Texte sind fest. - Das Layout – die Symbolleiste, die Zeilenstruktur, die Position der Zähler – ist fest; die Anzeigeeinstellungen in [KB10422. Ansichten, seitenweises Laden, Suche und Zähler: Anzeigeeinstellungen des Discussions-Webparts](https://vitextra.com/de/support/kb/10422) entscheiden, welche Elemente angezeigt werden. 💡 **Tipp** Wenn sich ein Board vom Rest der Seite abheben soll, platzieren Sie es in einem eigenen Abschnitt mit *weichem* oder *neutralem* Hintergrund und geben Sie dem Webpart einen Titel – das Webpart übernimmt die Variante des Abschnitts automatisch, ohne das Risiko unlesbaren Texts auf dunklem Hintergrund.