--- title: "Benutzerdefiniertes CSS" slug: "custom-css" updated: 2026-06-22T08:42:59Z published: 2026-06-22T08:42:59Z canonical: "docs.document360.com/custom-css" stale: true --- > ## Documentation Index > Fetch the complete documentation index at: https://docs.document360.com/llms.txt > Use this file to discover all available pages before exploring further. # Benutzerdefiniertes CSS Benutzerdefiniertes CSS in Document360 ermöglicht es Ihnen, Ihren eigenen CSS-Code anzuwenden, um das visuelle Erscheinungsbild Ihrer Wissensdatenbank über das hinauszugehen, was die eingebauten Anpassungseinstellungen der Seite bieten. Du schreibst CSS-Regeln direkt im Portal und sie werden weltweit auf deiner gesamten Wissensdatenbank angewendet. Das ist das richtige Werkzeug, wenn Sie präzise Kontrolle über Typografie, Farben, Abstände, Tabellenstile, Bildausrichtung oder andere visuelle Elemente benötigen, die nicht über die Standardeinstellungen konfiguriert werden können. --- ## Wann man benutzerdefiniertes CSS verwenden sollte Verwenden Sie benutzerdefiniertes CSS, wenn die integrierten Styling-Optionen in der Site-Anpassung Ihnen nicht die nötige Kontrolle geben: - **Standardstile überschreiben** – Ändern Sie das Erscheinungsbild von Elementen, die in den Einstellungen der Seite anpassen nicht angezeigt werden, wie z. B. Aufruffarben, Tabellenränder oder die Schaltfläche "Zurück nach oben". - **Wenden Sie markenkonsistente Typografie** an – stellen Sie eine bestimmte Schriftfamilie, Größe oder Gewicht auf alle Artikel ein, um den Designrichtlinien Ihres Produkts zu entsprechen. - **Beheben Sie Layout- oder Abstandsprobleme** – passen Sie Ränder, Polsterung oder Ausrichtung für bestimmte Elemente an, die anders aussehen als beabsichtigt. - **Wenden Sie visuelle Behandlungen auf Bilder** an – stellen Sie Bilder in Artikel in die Mitte aus, fügen Sie Schatten hinzu oder legen Sie konsistente Maße für Artikelillustrationen fest. HINWEIS Für gängige Anpassungen – Fließschrift, Überschrift, Tabellenformate, Bildausrichtung, Callout-Farben und Hintergrund des Heldenbereichs – stellt Document360 vorgefertigte CSS-Schnipsel bereit, die du mit einem Klick einfügen kannst. Sieh [dir CSS-Schnipsel](https://docs.document360.com/docs/de/css-snippets) an, bevor du benutzerdefiniertes CSS von Grund auf schreibst. --- ## Bevor du anfängst - Du musst ein Teamkonto mit Admin-Zugriff auf das Knowledge Base-Portal haben. - Benutzerdefiniertes CSS gilt global für die gesamte Wissensdatenbank – Änderungen betreffen alle Seiten und alle Leser. - Document360 validiert oder übersetzt deinen CSS-Code nicht, daher werden Fehler nicht automatisch gemeldet. - Fehlgeformte oder widersprüchliche CSS können das Layout der Seite zerstören. Teste deine Änderungen sorgfältig, bevor du speicherst. ::: --- ## Wie man benutzerdefiniertes CSS hinzufügen 1. Navigieren Sie zu () > **Knowledge base site** in der linken Navigationsleiste des Wissensdatenbankportals. 2. Im linken Navigationsfenster navigieren Sie zur **Site-Anpassung**. 3. Klicken Sie **auf benutzerdefiniertes CSS & JavaScript**. 4. Wähle den **CSS-Reiter** . Der CSS-Code-Editor erscheint. 5. Gib deinen CSS-Code in den Textbereich ein. ![](https://cdn.document360.io/860f9f88-412e-4570-8222-d5bf2f4b7dd1/Images/Documentation/site%20customization%20upd.png) 1. Drücken **Sie Strg + S** oder klicken Sie auf **Speichern** , um Ihre Änderungen anzuwenden. Das CSS wird jetzt auf deine Wissensdatenbank angewendet. Besuchen Sie die Website, um die Änderungen vorzusehen. --- ## Wie man CSS-Schnipsel verwendet CSS-Schnipsel sind vorgefertigte Codeblöcke, die man direkt in den CSS-Editor einfügen kann. Sie decken die häufigsten Anpassungsaufgaben ab und sind so konzipiert, dass sie an Ihre spezifischen Anforderungen angepasst werden können. 1. Navigieren Sie zu () > **Knowledge base site** > **Site-Anpassung** > **Custom CSS & JavaScript**. 2. Wähle den **CSS-Reiter** . 3. Klicke oben rechts im Code-Editor **auf Code-Snippets hinzufügen** . 4. Im Snippets-Panel klickst du auf den gewünschten Snippet. Der Code wird in den CSS-Editor eingefügt. ![Add code snippets panel showing all seven pre-loaded CSS snippet options in the Custom CSS editor](https://cdn.document360.io/860f9f88-412e-4570-8222-d5bf2f4b7dd1/Images/Documentation/Site-Customization-Using-CSS-snippets.png) 5. Ändern Sie den eingefügten Code nach Bedarf – zum Beispiel ersetzen Sie den Schriftnamen, den Farbcode oder den Größenwert. 6. **Drücke Strg + S** oder klicke **auf Speichern**. Für detaillierte Schritte zu jedem Snippet siehe [CSS-Snippets](https://docs.document360.com/docs/de/css-snippets). --- ## Best Practices - **Nutzen Sie die vorgefertigten Schnipsel als Ausgangspunkt** – selbst wenn Sie stark anpassen müssen, sorgt das Starten mit einem Ausschnitt für die richtigen Selektoren und Struktur für das HTML von Document360. - **Verwenden Sie bestimmte Selektoren** – vermeiden Sie breite Selektoren wie `body` oder `*` es sei denn, es ist absichtlich. Bestimmte Selektoren verringern das Risiko, andere Stile unbeabsichtigt zu übersteuern. - **Kommentiere deinen Code** – füge Kommentare hinzu, um zu erklären, was jeder Block macht, besonders wenn mehrere Teammitglieder das CSS verwalten. Beispiel: `/* Centers all article images — added June 2026 */` - **Teste sowohl im Hell- als auch im Dunkelmodus** – Stile, die im Hellmodus korrekt aussehen, können im Dunkelmodus Kontrast- oder Sichtbarkeitsprobleme haben. Immer beide vor dem Speichern vorschauen. - **Mach ein Backup** – bevor du größere Änderungen vornimmst, kopiere das aktuelle CSS in eine Textdatei. Document360 führt keine Versionshistorie mit benutzerdefinierten CSS-Änderungen. --- ## FAQ **Kann ich benutzerdefinierte .css-Dateien in Document360 anwenden?** Ja. Document360 ermöglicht es Ihnen, benutzerdefinierte `.css` Dateien zu referenzieren und anzuwenden, um das Erscheinungsbild und den Stil Ihrer Dokumentation anzupassen. **Wenn ich mehrere Marken verwalte, brauche ich dann für jede einen separaten Arbeitsplatz?** Sie können mehrere Marken verwalten, entweder indem Sie innerhalb eines Projekts separate Arbeitsbereiche erstellen oder zusätzliche Projekte für jede Marke kaufen. CSS, das auf Projektebene konfiguriert ist, gilt universell für alle Arbeitsbereiche. Sie können weiterhin das Styling von Landingpages und anderen Elementen für jeden Arbeitsbereich individuell anpassen. **Warum erscheint benutzerdefiniertes CSS nicht im Link zur teilbaren Vorschau?** Benutzerdefinierte CSS-, JavaScript- und HTML-Integrationen werden im teilbaren Vorschau-Link nicht angewendet. Dies ist ein erwartetes Verhalten – diese Anpassungen werden in teilbaren Vorschauen absichtlich deaktiviert, um eine konsistente Leistung und Sicherheit beim externen Teilen von Inhalten zu gewährleisten. Um das endgültige Erscheinungsbild Ihrer CSS-Änderungen zu sehen, veröffentlichen Sie den Artikel und greifen Sie direkt von der Knowledge Base aus darauf zu, oder verwenden Sie eine Sandbox-Umgebung.