Czy masz już dość patrzenia na pomarańczowy przycisk menu Firefox? Interfejs Firefoksa jest w pełni konfigurowalny, więc możesz zmienić kolor, tekst i inne właściwości przycisku menu Firefox, aby stworzyć własny, niestandardowy wygląd.
Aby zmienić wygląd przycisku menu Firefox, będziemy edytować plik userChrome.css. Ten plik pozwala zmienić wygląd dowolnej części Firefoksa, a także jego funkcjonalność.
Przed przystąpieniem do edycji pliku userChrome.css zainstalujemy dodatek o nazwie ChromEdit Plus, który pozwoli nam z łatwością edytować plik i zapisać go w odpowiednim formacie. Kliknij poniższy link, aby przejść do strony ChromEdit Plus.
http://webdesigns.ms11.net/chromeditp.html
Kliknij przycisk Dodaj do Firefox na stronie.
Może wyświetlić się następujący komunikat. Kliknij Zezwalaj, aby kontynuować instalację dodatku ChromEdit Plus.
UWAGA: Zachowaj szczególną ostrożność podczas wprowadzania rozszerzeń i innego oprogramowania. Jeśli nie masz pewności co do produktu lub nie ufasz firmie, nie instaluj. Testowaliśmy ChromEdit Plus i stwierdziliśmy, że jest bezpieczny i niezawodny.
Wyświetlone zostanie okno dialogowe Instalacja oprogramowania. Kliknij Zainstaluj teraz, które może być niedostępne do czasu zakończenia odliczania.
UWAGA: Możesz zmienić długość odliczania na przycisku Instaluj, ale nie zalecamy wyłączania go.
Musisz ponownie uruchomić Firefoksa, aby zakończyć instalację. Kliknij przycisk Uruchom ponownie teraz w wyskakującym oknie dialogowym.
Po ponownym uruchomieniu przeglądarki Firefox przycisk ChromEdit Plus zostanie dodany po prawej stronie pola Adres. Kliknij, aby otworzyć okno ChromEdit Plus.
Domyślnie są trzy zakładki w oknie ChromEdit Plus. Będziemy edytować plik userChrome.css, który znajduje się na pierwszej karcie. Jeśli karta jest pusta, skopiuj i wklej następujący tekst na karcie userChrome.css i kliknij przycisk Zapisz. To daje domyślny plik userChrome.css.
@namespace url ("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
# appmenu-button
tło: #orange! important;
# dropmarker przycisku appmenu: przed
treść: "Firefox"! ważne;
kolor: #FFFFFF! important; important;
# appmenu-button .button-text
wyświetlanie: brak! ważne;
Być może już masz plik userChrome.css, w którym to przypadku na karcie userChrome.css będzie już tekst. Skopiuj cały tekst powyżej, z wyjątkiem pierwszego wiersza, linii @namespace i wklej go na kartę gdzieś po linii @namespace. Jeśli chcesz zachować to, co już masz, możesz wkleić powyższy tekst na końcu pliku.
WAŻNE: Upewnij się, że wszystkie cytaty w userChrome.css NIE są cytatami inteligentnymi, w tym tymi z linii @namespace. Powinny być zwykłymi, prostymi cytatami. Jeśli którykolwiek z nich to inteligentne cytaty, plik w ogóle nie wpłynie na wygląd Firefoksa.
Kliknij Uruchom ponownie, aby ponownie uruchomić przeglądarkę Firefox, używając nowego lub poprawionego pliku userChrome.css.
W tym przykładzie zmieniamy kolor tła na ciemnoniebieski i zmieniamy tekst "Firefox" na "How-To Geek".
Aby zmienić kolor tła, zmień tekst "#orange" na linii "background" w sekcji "# appmenu-button" na inny kolor, używając kodu koloru szesnastkowego lub kodu koloru HTML. Na przykład wybraliśmy kolor ciemnoniebieski z kodem heksadecymalnym # 2C4362.
UWAGA: Aby dowiedzieć się, jaki jest kod koloru heksadecymalnego dla wybranego koloru, zobacz nasze artykuły o uzyskiwaniu kodów kolorów szesnastkowych z dziesiętnych kolorów RGB, wybieraniu kolorów z dowolnego miejsca na ekranie i uzyskiwaniu kodów kolorów w różnych formatach.
Aby zmienić tekst na przycisku, zmień tekst "Firefox" w wierszu "treści" w sekcji "# appmenu-button dropmarker: before" na żądany tekst, na przykład "How-To Geek". Dodaliśmy spację po tekście, aby uzyskać więcej miejsca między tekstem a strzałką w dół na przycisku.
Możesz także zmienić kolor tekstu, zmieniając wiersz "kolor" w tym samym "# appmenu-button dropmarker: before" section. Zostawiliśmy kolor tekstu jako biały (#FFFFFF), ale można go zmienić na kolor jasnoszary (# F2F2F2) lub coś w tym stylu.
Kliknij Zapisz, a następnie Uruchom ponownie, aby zmiany zostały wprowadzone.
Przycisk jest teraz ciemnoniebieski i mówi "How-To Geek".
Możesz także dodać obraz tła do przycisku, oprócz zmiany koloru tła. Stworzyliśmy obraz, który ma favikon How-To Geek po lewej stronie i przezroczyste tło, dzięki czemu ciemnoniebieski kolor tła jest widoczny. Aby dodać obraz tła do przycisku, dodaj następujący wiersz do sekcji "# appmenu-button", zmieniając ścieżkę w cudzysłowie do lokalizacji obrazu na komputerze. Pozostaw "plik: ///" w ścieżce.
background-image: url ("file: /// C: /Users/Lori/Pictures/htg_background.png")! important;
Kliknij Zapisz i ponownie uruchom ponownie.
Teraz nasz przycisk jest kompletny.
Możesz także dostosować przycisk menu Firefox, przekształcając go w ikonę. Opublikowaliśmy także wiele innych wskazówek i usprawnień, które pozwalają w pełni wykorzystać możliwości Firefoksa.
