1. Home
  2. News
  3. Download
    1. Thunderbird Release Version
    2. Thunderbird 140 ESR
    3. Thunderbird 128 ESR
    4. Thunderbird 115 ESR
    5. Thunderbird Beta Version
    6. Language Pack (User Interface)
    7. Dictionaries (Spell Check)
  4. Help & Lexicon
    1. Instructions for Thunderbird
    2. Questions & Answers (FAQ) about Thunderbird
    3. Help for this Website
  5. Forums
    1. Unresolved Threads
    2. Latest Posts
    3. Threads of the last 24 hours
  • Login
  • Register
  • 
  • Search
Lexicon
  • Everywhere
  • Forum
  • Lexicon
  • Articles
  • Pages
  • More Options
  1. Thunderbird Mail DE
  2. Lexikon

Benutzeroberfläche per userChrome.css anpassen

  • Thunder
  • September 15, 2015 at 12:55 AM
  • August 28, 2020 at 11:24 AM
  • 85,433 times viewed
  • Table Of Contents

    • 1 Datei userChrome.css erstellen
    • 2 Der korrekte Ort für die Datei userChrome.css
    • 3 Beispiele für die userChrome.css
      • 3.1 Nachrichten-/Themenliste
        • 3.1.1 Zebrastreifen
        • 3.1.2 Punkt statt leerem Stern für nicht gekennzeichnete Nachrichten
      • 3.2 Ordner-/Kontenliste
        • 3.2.1 Ordnerfarbe bei neuen Nachrichten
        • 3.2.2 Die Linien der Baumhierarchie anzeigen
    • 4 Siehe auch

    Die Benutzeroberfläche des Thunderbird lässt sich (neben anderen Methoden) auch per CSS-Code anpassen. Die notwendigen CSS-Codes müssen in eine Textdatei mit dem Namen "userChrome.css" in einen Unterordner "chrome" innerhalb des Profilordners geschrieben werden.

    Thunderbird lässt sich auf verschiedene Art und Weise individuell anpassen. Der Funktionsumfang kann per Erweiterungen über den Add-on-Manager erweitert werden. Die Optik der Benutzeroberfläche lässt sich mittels Themes ebenfalls über den Add-on-Manager verändern. Die Möglichkeiten der Themes waren früher ziemlich weitreichend. Seit Thunderbird-Version 60 und neuer können Themes aber nur noch wenig am Aussehen der Benutzeroberfläche verändern. Im Grunde beschränken sich diese "Lightweight-Themes" nur noch auf ein paar Farben und Hintergrundbilder. Thunderbird selbst bringt dafür schon einen "Light-Mode" und einen "Dark-Mode" mit. Wer mehr verändern möchte, kann dies aber weiterhin mit CSS in der Datei userChrome.css machen.

    Wichtig

    Ab Thunderbird 78 werden die benutzerdefinierten Stylesheets (also auch die userChrome.css) standardmäßig nicht mehr geladen und bleiben somit wirkungslos. Man muss deshalb in Thunderbird mit dem Konfig-Editor noch eine versteckte Einstellung umschalten: toolkit.legacyUserProfileCustomizations.stylesheets muss auf true geschaltet werden.

    1 Datei userChrome.css erstellen

    Die Datei "userChrome.css" muss bitte manuell als reine Textdatei erstellt werden und muss genau so benannt werden, wie hier geschrieben (Groß-/Kleinschreibung beachten)! Man kann die Datei entsprechend also am besten mit einem ganz "einfachen" Texteditor bearbeiten.

    2 Der korrekte Ort für die Datei userChrome.css

    Die Datei muss innerhalb des Profilordners in einen Unterordner "chrome" gespeichert werden. Es ergibt sich also sinngemäß folgender Pfad: .../Thunderbird/Profiles/12345678.default-user/chrome/userChrome.css. Falls Sie den Profilordner nicht finden können, lesen Sie bitte in "Profilordner - Wo ist er zu finden?" nach.

    3 Beispiele für die userChrome.css

    Hinweis

    Die folgenden Beispiele funktionieren eventuell nicht mit anderen Themes oder neueren/älteren Programmversionen! Viele CSS-Codes findet man im Forum, wo man auch weitere Hilfe von entsprechend erfahrenen Benutzern erhält.

    3.1 Nachrichten-/Themenliste

    3.1.1 Zebrastreifen

    Im Verlauf der Versionen wurde ein wechselweise gestreifter Hintergrund eingeführt und später auf Grund von Geschwindigkeitsproblemen (in Einzelfällen) wieder entfernt. Um die typischen Zebrastreifen zu erhalten, kann man background-color: #ededed; verwenden. Um eventuell vorhandene Streifen zu beseitigen, kann man background-color: transparent !important; verwenden.

    Windows::

    CSS: userChrome.css
    #threadTree treechildren::-moz-tree-row(odd) {
        background-image: none !important;
    }

    Mac OSX und Linux:

    CSS: userChrome.css
    #threadTree treechildren::-moz-tree-row(odd) {
        background-color: transparent !important;
    }
    #threadTree treechildren::-moz-tree-row(odd, selected) {
        background-color: Highlight !important;
    }

    3.1.2 Punkt statt leerem Stern für nicht gekennzeichnete Nachrichten

    Für Nachrichten, die nicht "gekennzeichnet" sind, wurde das frühere "Punkt"-Symbol durch einen leeren Stern ersetzt. Das leere Stern-Symbol kann eventuell zu Verwirrung führen. Daher kann man das leere Stern-Symbol durch das frühere "Punkt"-Symbol ersetzen.

    Windows:

    CSS: userChrome.css
    treechildren::-moz-tree-image(flaggedCol) {
        list-style-image: url("chrome://messenger/skin/icons/readmail.png") !important;
        -moz-padding-start: 0px !important; -moz-margin-start: -3px !important;
    }
    treechildren::-moz-tree-image(flaggedCol, flagged) {
        list-style-image: url("chrome://messenger/skin/icons/flag.png") !important;
    }

    Linux:

    CSS: userChrome.css
    treechildren::-moz-tree-image(flaggedCol) {
        -moz-image-region: rect(0px 16px 16px 0px) !important;
    }
    treechildren::-moz-tree-image(flaggedCol, flagged) {
        -moz-image-region: rect(80px 16px 96px 0px) !important;
    }

    Für Windows kann man "flag.png" durch "flag-col.png" ersetzen, um einen kleineren Stern zu erhalten. Für Linux muss man die Koordinaten (quasi den Bildausschnitt) der Grafik-Datei ändern, die mehrere Symbole zusammen enthält.

    3.2 Ordner-/Kontenliste

    Anpassen der Konten-/Ordnerliste links im Hauptfenster:

    3.2.1 Ordnerfarbe bei neuen Nachrichten

    In bisherigen Thunderbird-Versionen wurden Ordner mit neuen Nachrichten dadurch gekennzeichnet, dass der Ordnername fett dargestellt und ein orangefarbener Stern am Ordnersymbol erschien. Nun wird der Ordername fett und in einer anderen Farbe dargestellt. Die Farbe ist abhängig vom Betriebssystem und kann leider schlecht zu differenzieren/erkennen sein. Um die Farbe zu ändern, verwenden Sie:

    Windows und Linux:

    CSS: userChrome.css
    treechildren::-moz-tree-cell-text(folderNameCol, newMessages-true) {
        color: red !important;
    }

    Dadurch wird die Farbe in allen Stadien geändert. Sie können aber noch zusätzlich differenzieren für ausgewählte und/oder fokussierte Ordner:

    CSS: userChrome.css
    treechildren::-moz-tree-cell-text(folderNameCol, newMessages-true, selected, focus) {
        color: orange !important;
    }

    Verwendet man die beiden CSS-Einträge, werden Ordner mit neuen Nachrichten mit einem roten Ordnernamen dargestellt, wenn sie nicht ausgewählt sind. Ausgewählte und fokussierte Ordnernamen werden orange auf dem betriebssystemabhängigen Hintergrund dargestellt. Für Windows ist das Orange auf blauem Hintergrund (mit dem klassischen Windows-Theme). Sie können jede beliebige Farbe als #rrggbb festlegen.

    3.2.2 Die Linien der Baumhierarchie anzeigen

    Die Linien wurden schon seit längerem entfernt. Wenn Sie viele Konten und Unterordner verwenden, kann die Anzeige der Linien aber hilfreich sein:

    Alle Plattformen:

    CSS: userChrome.css
    #folderTree treechildren::-moz-tree-line {
        visibility: visible !important;
    }

    Hinweis: Dies funktioniert auch für den Konten-Manager. Verwenden Sie dafür das gleiche CSS, jedoch mit #accounttree statt #folderTree.

    4 Siehe auch

    • Forum für "Manuelle Anpassungen per CSS oder Script"
    • Weitere und detaillierte Informationen (auch zum Verwenden der Entwickler-Werzeuge in Thunderbird, um CSS-Selektoren zu finden) sind in folgenden Forenbeiträgen von Mapenzi zu finden:
      • Benutzeroberfläche per userChrome.css umgestalten (Teil I)
      • Benutzeroberfläche per userChrome.css umgestalten (Teil II)
      • Benutzeroberfläche per userChrome.css umgestalten (Teil II)
    Beteiligte Autoren

    Graba, Thunder

    • Quote
  • Previous entry Benutzeroberfläche
  • Next entry Blindkopie (BCC) - Unterschied zu An und Kopie (CC)
  • PDF

Current app version

  • Thunderbird 146.0 veröffentlicht

    Thunder December 13, 2025 at 5:28 AM

Current 140 ESR version

  • Thunderbird 140.6.0 veröffentlicht

    Thunder December 13, 2025 at 5:18 AM

Current 128 ESR version

  • Thunderbird 128.14.0 ESR veröffentlicht

    Thunder August 21, 2025 at 3:04 PM

No Advertisements

There are no advertisements here. Maybe you give the website owner (Alexander Ihrig - aka "Thunder") instead something to be able to finance these sites in the long run. Many Thanks!

Thank you for the support!

Coffee to be spent?

Donate now via Paypal*

*Forwarding to PayPal.Me

Categories

  1. FAQ about Thunderbird 31
  2. Instructions for Thunderbird 143
  3. Help for this website 18
Thunderbird Mail DE
  1. Imprint & Contact
  2. Privacy Policy
    1. Cookie Policy
  3. Terms of Use
  4. Donation Call for Thunderbird
Help for this website
  • All website support articles
  • How to use website search
  • How to create a forums user account
  • How to create and edit a forums thread
  • How to reset your forums password
Copyright © 2003-2025 Thunderbird Mail DE

You are NOT on an official page of the Mozilla Foundation. Mozilla®, mozilla.org®, Firefox®, Thunderbird™, Bugzilla™, Sunbird®, Seamonkey®, XUL™ and the Thunderbird logo are (among others) registered trademarks of the Mozilla Foundation.

Lexicon, developed by www.viecode.com
Powered by WoltLab Suite™