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 II)

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

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


    Neben "Stylish" gibt es noch das Add-on "ChromeEdit Plus" http://webdesigns.ms11.net/chromeditp.html, das seit Jahren nicht mehr weiterentwickelt wurde. Es funktioniert aber weiterhin als Editor der userChrome.css-Datei in der aktuellen Version TB 45.x und sogar in der Entwickler-Version Daily 54.0a1.

    Nach der Installation dieses Add-ons kann man den Button "ChromeEdit" über den Rechtsklick > Anpassen in die Hauptmenüleiste ziehen und die userChrome.css-Datei durch einen Klick auf den Button in einem eigenen Fenster öffnen, um sie zu editieren.
    Am unteren Fensterrand befinden sich die Buttons "Save" und "Restart" zum Speichern von Code-Änderungen und zum erforderlichen Neustart von TB.

    Im Menü "Extras" wird zusätzlich ein Untermenü "ChromeEdit Plus" geschaffen, über das man u. a. direkt den Profilordner öffnen kann.

    Natürlich kommt jetzt sofort die Frage: "Wie kann ich solche Regeln erstellen, wenn ich die "CSS-Sprache" nicht kenne"?

    Zu Beginn ist es sicher einfacher, solche "fertige" Regeln durch eine Suche mit den entsprechenden Schlüsselwörtern im Web zu finden, wobei man bei Benutzung von englischen Schlüsselwörtern mehr Erfolgsaussichten hat. Auch mit einer Suche in diesem Forum mit "userchrome" oder "stylish" kann man u. U. schon den erforderlichen Code finden.
    Die Webseite http://www.linnhe2.free-online.co.uk/thunderbird/chrome.html bietet eine recht umfangreiche Liste von CSS-Codes an, mit der man die Benutzeroberfläche von TB umgestalten kann. Wer Zeit und Lust hat, kann einige dieser Codes testen und sich gleichzeitig mit dem Aufbau dieser Regeln etwas vertraut machen.

    Die größte Schwierigkeit ist häufig, überhaupt erst einmal den Namen (die ID) des Elements der Benutzeroberfläche zu finden, das man ändern möchte.
    Dazu können die beiden Add-ons "DOM-Inspector" https://addons.mozilla.org/en-US/firefox/…inspector-6622/ und "InspectorWidget" https://addons.mozilla.org/en-US/thunderb…nspectorwidget/ gute Dienste leisten. Nach der Installation von InspectorWidget muss noch über einen R-Klick > Anpassen der Button "Inspect" mit der Maus in die Hauptmenüleiste gezogen werden.

    Ich will das Arbeiten mit diesen Add-ons anhand eines Beispiels illustrieren.
    Für meine alternden Augen ist die Schrift im Nachrichten-Header (das Fensterchen mit "Von", "Betreff", "An" zwischen Themen/Nachrichtenliste und Nachrichtenbereich) zu klein und ich möchte sie deshalb vergrößern.

    Ich klicke zunächst auf den Button "Inspect", halte dann die Umschalttaste gedrückt und klicke mit der Maus in den Nachrichten-Header einer geöffneten Mail. Daraufhin öffnet sich das Inspektions-Fenster "chrome://messenger/content/messenger.xul", in dem ein Element blau markiert ist, und zwar je nachdem wo ich gerade im Nachrichten-Header geklickt habe. Wenn ich z. B. auf "Betreff" geklickt habe, wird das Element "expandedsubjectBox" markiert. Wenn ich im Inspektions-Fenster auf darüber (oder darunter) liegende Elemente klicke, wird das jeweilige Element im Nachrichten-Header in einem roten blinkenden Rahmen angezeigt. Beim Klick auf "msgHeaderViewDeck" sieht es dann so aus:

    Jetzt klicke ich auf das Drop-down Symbol neben "Objekt", wähle "CSS-Regeln" und mache in der neuen Ansicht einen R-Klick auf "#msgHeaderView" > "Datei ansehen":

    Danach öffnet sich die entsprechende Datei "messageHeader.css" in einem neuen Fenster:

    Aus dieser Datei kopiere ich den Code und ändere ihn, so dass er nun folgendermaßen heißt:

    Code
    #msgHeaderView {
    font-size: 130%; }

    Diesen Code füge ich über ChromeEdit in die userChrome.css-Datei ein, speichere ihn und starte TB neu.
    Die Schriftgröße im Nachrichten-Header ist deutlich um 30% erhöht:

    Man erhält ein ähnliches Ergebnis, wenn man den Wert 100% zum Beispiel durch 16px oder auch 4mm ersetzt.

    Edited 3 times, last by Mapenzi (February 18, 2017 at 11:33 AM).

  • graba
    Global Moderator
    Reactions Received
    606
    Posts
    21,862
    Member since
    17. May. 2006
    Helpful answers
    9
    • February 17, 2017 at 7:46 PM
    • #2

    Hallo Mapenzi,

    vielen Dank für deine beiden Beiträge zur möglichen Umgestaltung der Benutzeroberfläche von Thunderbird! Tolle Leistung! :thumbsup:

    Die genannten Beiträge dienen als erweiterte Information zu dem Wiki-Artikel Themes per userChrome.css anpassen

    Bei Anmerkungen, Ergänzungen, Fragen etc. zu dem Thema bitte einen eigenen Thread eröffnen!

    Gruß
    graba :ziehtdenhut:

    Keine Forenhilfe per Konversation!
    Für Thunderbird-Entwicklung spenden

  • 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™