1. Home
  2. News
  3. Download
    1. Thunderbird Release Version
    2. Thunderbird 140 ESR
    3. Thunderbird 115 ESR
    4. Thunderbird Beta Version
    5. Language Pack (User Interface)
    6. Dictionaries (Spell Check)
  4. Help & Lexicon
    1. Instructions for Thunderbird
    2. Questions & Answers (FAQ) about Thunderbird
    3. Help for this Website
    4. Last Changes
  5. Forums
    1. Unresolved Threads
    2. Latest Posts
    3. Threads of the last 24 hours
  • Login
  • Register
  • 
  • Search
This Thread
  • Everywhere
  • This Thread
  • This Forum
  • Forum
  • Lexicon
  • Articles
  • Pages
  • More Options
  1. Thunderbird Mail DE
  2. Forum
  3. Hilfe zu Add-ons und manuellen Anpassungen
  4. Manuelle Anpassungen per CSS oder Script

Benutzeroberfläche per userChrome.css umgestalten (Teil I)

  • Mapenzi
  • February 17, 2017 at 7:22 PM
  • Closed
  • Thread is Resolved
  • Mapenzi
    Senior Member
    Reactions Received
    1,097
    Posts
    12,454
    Member since
    26. May. 2012
    Helpful answers
    128
    • February 17, 2017 at 7:22 PM
    • #1

    Um Rückfragen vorzubeugen, bitten wir um folgende Angaben:
    * Thunderbird-Version: 45.x.x
    * Betriebssystem + Version: alle

    Die Anweisungen oder Regeln für die Gestaltung der Benutzeroberflächen (Layout, Farben, Rahmen, Textformate) der Mozilla-Programme Thunderbird und Firefox sind in der sogenannten "CSS-Sprache" (Cascading Style Sheets) geschrieben, während zur Festlegung der Inhalte eines Web-Dokuments HTML und XML verwendet werden.
    https://de.wikipedia.org/wiki/Cascading_Style_Sheets
    Diese Style Sheets können beliebig viele solcher Regeln (rules) enthalten und werden als *.css-Dateien gespeichert. Die das Thunderbird-Adressbuch betreffenden Dateien heißen z. B. addressbook.css, abContactsPanel.css, abResultsPanel.css und cardDialog.css, entsprechend der Aufteilung des Adressbuch-Fensters, während der CSS-Code für das Verfassen-Fenster in einer einzigen Datei messengercompose.css zusammengefasst ist.
    All diese *.css-Dateien sind in Unterverzeichnissen des Ordners "chrome" gespeichert, der ein wichtiger Bestandteil des Thunderbird-Anwendungspakets ist.

    Manche Thunderbird-Nutzer möchten gerne die Benutzeroberfläche ändern, beispielsweise um etwas mehr Farbe hineinzubringen oder andere Schriftarten/Schriftgrößen zu wählen, ohne gleich ein komplettes "Theme" zu installieren. Dies ist durch das Erstellen von neuen, abweichenden Regeln möglich, die dann von TB anstelle der entsprechenden Regeln in den *.css-Dateien des Original-Codes benutzt werden.
    Angenommen, wir möchten nur die Schriftgröße in der Konten/Ordnerliste erhöhen, dann müssen wir eine neue Regel schreiben, die angibt, wie groß (in Pixel oder auch in Millimeter oder %) die Schrift in dem Bereich Konten/Ordnerbaum sein soll, abweichend von der Größe, wie sie der Originalcode von TB standardmäßig festgelegt hat. Diese simple Regel sieht folgendermaßen aus:

    CSS
    #folderTree {
    font-size: 13px !important; }

    Die erste Zeile beginnt mit einem Doppelkreuz # gefolgt vom Namen (oder Identität ID) des zu ändernden Elements folderTree und endet mit einer öffnenden geschweiften Klammer {
    Die nächste Zeile beginnt mit der zu ändernden Eigenschaft font-size, gefolgt von einem Doppelpunkt und dem neuen Wert 13px, dem Ausdruck !important, einem Semikolon und einer abschließenden geschweiften Klammer }
    Man könnte hier den Ausdruck !important auch weglassen, da er für die Eigenschaft font-size eigentlich nicht erforderlich ist. Bei vielen anderen Eigenschaften ist er jedoch notwendig, damit der Code wirksam ist, weshalb man ihn grundsätzlich einfügen sollte.

    Wenn wir gleichzeitig auch die Schriftart der Konten/Ordnerliste ändern wollen, dann erweitern wir die Regel wie im folgenden Beispiel:

    CSS
    #folderTree {
    font-size: 13px !important;
    font-family: Palatino !important; }


    Da je nach gewählter Größe und Art der Schrift die Zeilenabstände zu gering werden könnten und damit zu einem "Überschneiden" der Konten- und Ordnernamen führen, müssen wir gegebenenfalls die folgende Regel für den Zeilenabstand im Konten/Ordnerbaum (folderTree) hinzufügen:

    CSS
    #folderTree > treechildren::-moz-tree-row {
    height: 18px !important; }


    Damit man auch später noch weiß, wozu diese Codes dienen, sollte man noch eine knappe, von den Zeichen /* und */ eingerahmte Erklärung voransetzen. Beispiel:

    CSS
    /* Schrift Konten-Ordnerbaum */
    #folderTree {
    font-size: 13px !important;
    font-family: Palatino !important; }
    #folderTree > treechildren::-moz-tree-row {
    height: 18px !important; }


    Um diese Regeln anwendbar zu machen, öffnen wir einen Text-Editor und kopieren zunächst die folgenden Zeilen hinein, mit der die meisten *.css-Dateien von TB beginnen (diese Zeilen brauchen nur einmalig eingefügt und nicht wiederholt zu werden):

    Code
    @namespace xul url(http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul);
    /* set default namespace to XUL */


    Darunter fügen wir unsere obigen Regeln ein, so dass der Inhalt der Text-Datei nun so aussieht:

    CSS
    @namespace url(http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul);
    /* set default namespace to XUL */
    /* Schrift Konten-Ordnerbaum */
    #folderTree {
    font-size: 13px !important;
    font-family: Palatino !important; }
    #folderTree > treechildren::-moz-tree-row {
    height: 18px !important; }


    Jetzt muss die Datei unter dem Namen "userChrome.css" (ohne die Endung .txt !) gespeichert werden. Danach verschieben wir sie in einen neu erstellten Ordner "chrome", den wir in den Profilordner von TB einfügen. Nach einem Neustart von TB sollten die gewünschten Änderungen im Konten/Orderbaum sichtbar sein, da die Regeln der userChrome.css-Datei jetzt den Vorrang vor den entsprechenden CSS-Regeln im Original-Code haben. Wenn die Größe der Schrift oder der Zeilenabstand nicht zufriedenstellend ist, müssen die entsprechenden Werte in der Datei userChrome.css erhöht oder verkleinert werden, worauf wieder ein Neustart von TB erforderlich ist.

    Anstatt eine userChrome.css-Datei zu erstellen, kann man auch das Add-on "Stylish" in Thunderbird installieren, einen neuen "Style" erstellen, die obigen Regeln (ohne die beiden @namespace url…. Zeilen) in den Kasten des neuen Style kopieren und auf "Vorschau" (oder "Speichern") klicken. Die Änderungen des Codes werden sofort aktiviert. Man muss allerdings häufig zunächst mit der Maus in den entsprechenden Bereich der Benutzeroberfläche (hier den Konten/Ordnerbaum) klicken, damit sie angezeigt werden.
    Der große Vorteil des Add-ons gegenüber der Datei userChrome.css liegt also darin, dass man TB nicht nach jeder Änderung einer Regel neu starten muss.
    Die mittels "Stylish" durchgeführten Änderungen werden übrigens in der Datei "stylish.sqlite" im TB Profil gespeichert.

    Warnung

    Seit "Stylish" bzw. "userstyles.org" im Oktober 2016 an einen neuen Eigentümer verkauft wurde, hat sich die Privacy Policy geändert und das Add-on ist in den Ruf eines Datensammlers geraten.

    Siehe dazu den Artikel von Martin Brinkmann http://www.ghacks.net/2016/10/09/sty…ve-a-new-owner/ und die Diskussion Browser Add-On Stylish – der neue Datensammler? im Nachbarforum. Die neue Privacy Policy von userstyles.org kann hier eingesehen werden: https://userstyles.org/login/policy
    Inwieweit die Privatsphäre bei der Benutzung von Stylish in Thunderbird gefährdet ist, kann ich nicht beurteilen.

    Eine Alternative zu "Stylish" wird in Teil II beschrieben.

    Edit: Bei Anmerkungen, Ergänzungen, Fragen etc. zu dem Thema bitte einen eigenen Thread eröffnen! graba, S-Mod.

    Edited 2 times, last by graba (February 18, 2017 at 12:24 AM).

  • Thunder August 26, 2018 at 1:49 PM

    Moved the thread from forum Themes to forum Manuelle Anpassungen per CSS oder Script.

Current app version

  • Thunderbird 151.0.1 veröffentlicht

    Thunder May 27, 2026 at 11:54 PM

Current 140 ESR version

  • Thunderbird 140.11.1 ESR veröffentlicht

    Thunder May 27, 2026 at 12:00 AM

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

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-2026 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.

Powered by WoltLab Suite™