28Jun
Sind Sie es leid, den orangefarbenen Firefox-Menüknopf zu sehen? Die Benutzeroberfläche von Firefox ist vollständig anpassbar, so dass Sie die Farbe, den Text und andere Eigenschaften der Firefox-Menüschaltfläche ändern können, um Ihren eigenen benutzerdefinierten Look zu erstellen.
Um das Erscheinungsbild der Schaltfläche "Firefox-Menü" zu ändern, bearbeiten wir die Datei "userChrome.css".Mit dieser Datei können Sie die Darstellung von Firefox sowie dessen Funktionalität ändern.
Bevor wir mit der Bearbeitung der Datei userChrome.css beginnen, installieren wir ein Add-On namens ChromEdit Plus, mit dem wir die Datei einfach bearbeiten und im richtigen Format speichern können. Klicken Sie auf den folgenden Link, um zur ChromEdit Plus-Webseite zu gelangen.
http: //webdesigns.ms11.net/ chromeditp.html
Klicken Sie auf die Schaltfläche Add to Firefox auf der Seite.
Die folgende Meldung wird möglicherweise angezeigt. Klicken Sie auf Zulassen, um mit der Installation des Add-Ons ChromEdit Plus fortzufahren.
HINWEIS: Seien Sie sehr vorsichtig bei der Installation von Erweiterungen und anderer Software. Wenn Sie sich über das Produkt nicht sicher sind oder dem Unternehmen nicht vertrauen, installieren Sie es nicht. Wir haben ChromEdit Plus getestet und festgestellt, dass es sicher und zuverlässig ist.
Das Dialogfeld Software-Installation wird angezeigt. Klicken Sie auf "Jetzt installieren", die möglicherweise erst verfügbar ist, wenn der Countdown abgelaufen ist.
HINWEIS: Sie können die Länge des Countdowns über die Schaltfläche Installieren ändern, wir empfehlen jedoch nicht, sie zu deaktivieren.
Sie müssen Firefox neu starten, um die Installation abzuschließen. Klicken Sie im Popup-Dialogfeld auf Jetzt neu starten.
Sobald Firefox neu gestartet wird, wird die Schaltfläche "ChromEdit Plus" rechts neben dem Feld "Adresse" hinzugefügt. Klicken Sie darauf, um das ChromEdit Plus-Fenster zu öffnen.
Im ChromeEdit Plus-Fenster sind standardmäßig drei Registerkarten vorhanden. Wir werden die Datei userChrome.css bearbeiten, die sich auf der ersten Registerkarte befindet. Wenn die Registerkarte leer ist, kopieren Sie den folgenden Text und fügen Sie ihn auf der Registerkarte userChrome.css ein und klicken Sie auf Speichern. Dies gibt Ihnen eine Standarddatei userChrome.css.
@namespace url( "http: //www.mozilla.org/keymaster/gatekeeper/ there.is.only.xul");
# appmenu-button{
Hintergrund: #orange! Wichtig;
}
# appmenu-button dropmarker: vor{
Inhalt: "Firefox"! Wichtig;
Farbe: #FFFFFF! Wichtig;
}
# appmenu-button. button-text{
display: keine! Wichtig;
}
Möglicherweise verfügen Sie bereits über eine userChrome.css-Datei. In diesem Fall ist bereits Text auf der Registerkarte userChrome.css vorhanden. Kopieren Sie den gesamten obigen Text mit Ausnahme der ersten Zeile, der @namespace-Zeile, und fügen Sie ihn auf der Registerkarte irgendwo hinter der @namespace-Zeile ein. Wenn Sie behalten möchten, was Sie bereits haben, können Sie den obigen Text am Ende der Datei einfügen.
WICHTIG: Stellen Sie sicher, dass alle Anführungszeichen in der userChrome.css keine intelligenten Anführungszeichen sind, einschließlich der Anführungszeichen in der @namespace-Zeile. Sie sollten gewöhnliche, gerade Zitate sein. Wenn einige von ihnen intelligente Anführungszeichen sind, beeinflusst die Datei das Erscheinungsbild von Firefox überhaupt nicht.
Klicken Sie auf Neustart, um Firefox mit der neuen oder überarbeiteten Datei userChrome.css neu zu starten.
In diesem Beispiel ändern wir die Hintergrundfarbe in ein dunkles Blau und ändern den "Firefox" -Text in "How-To Geek".
Um die Hintergrundfarbe zu ändern, ändern Sie den Text "#orange" in der Zeile "background" im Abschnitt "# appmenu-button" in eine andere Farbe, indem Sie den Hex-Farbcode oder den HTML-Farbcode verwenden. Zum Beispiel haben wir ein dunkles Blau mit dem Hex-Farbcode # 2C4362 gewählt.
HINWEIS: Um den Hexadezimalfarbcode für eine gewünschte Farbe herauszufinden, lesen Sie unsere Artikel über das Abrufen von Hexadezimalfarben aus dezimalen RGB-Farben, das Auswählen von Farben von einer beliebigen Stelle auf dem Bildschirm und das Abrufen von Farbcodes in verschiedenen Formaten.
Um den Text auf der Schaltfläche zu ändern, ändern Sie den Text "Firefox" in der Zeile "Inhalt" im Abschnitt "# appmenu-button dropmarker: before" in den gewünschten Text, z. B. "How-To Geek".Wir haben hinter dem Text ein Leerzeichen eingefügt, um mehr Platz zwischen dem Text und dem Dropdown-Pfeil auf der Schaltfläche zu haben.
Sie können auch die Farbe des Textes ändern, indem Sie die Zeile "Farbe" im gleichen Abschnitt "# appmenu-button dropmarker: before" ändern. Wir haben die Textfarbe als weiß( #FFFFFF) belassen, aber Sie können sie in etwas Hellgraues( # F2F2F2) oder etwas Ähnliches ändern.
Klicken Sie auf Speichern und dann auf Neu starten, damit die Änderungen wirksam werden.
Der Button ist nun dunkelblau und sagt "How-To Geek".
Sie können der Schaltfläche auch ein Hintergrundbild hinzufügen und zusätzlich die Hintergrundfarbe ändern. Wir haben ein Bild mit dem Favicon How-To Geek auf der linken Seite und einem transparenten Hintergrund erstellt, sodass die dunkelblaue Hintergrundfarbe durchscheinen kann. Um der Schaltfläche ein Hintergrundbild hinzuzufügen, fügen Sie die folgende Zeile zum Abschnitt "# appmenu-button" hinzu, indem Sie den Pfad in den Anführungszeichen zum Speicherort Ihres Bilds auf Ihrem Computer ändern. Belassen Sie die Datei "///" im Pfad.
background-image: url( "Datei: /// C: /Users/Lori/Pictures/ htg_background.png")! Wichtig;
Klicken Sie auf Speichern und erneut starten.
Jetzt ist unser Knopf komplett.
Sie können die Firefox-Menüschaltfläche auch anpassen, indem Sie sie in ein Symbol umwandeln. Wir haben auch viele andere Tipps und Verbesserungen veröffentlicht, um das Beste aus Firefox zu machen.