Ti stanchi di guardare il pulsante arancione del menu di Firefox? L'interfaccia di Firefox è completamente personalizzabile, quindi puoi modificare il colore, il testo e altre proprietà del pulsante del menu di Firefox per creare il tuo aspetto personalizzato.
Per cambiare l'aspetto del pulsante del menu di Firefox, modificheremo il file userChrome.css. Questo file consente di modificare l'aspetto di qualsiasi parte di Firefox, nonché la sua funzionalità.
Prima di immergerci nella modifica del file userChrome.css, installeremo un add-on, chiamato ChromEdit Plus, che ci permetterà di modificare facilmente il file e salvarlo nel formato corretto. Fare clic sul collegamento seguente per accedere alla pagina Web di ChromEdit Plus.
Fare clic sul pulsante Aggiungi a Firefox nella pagina.
Potrebbe essere visualizzato il seguente messaggio. Fai clic su Consenti per continuare l'installazione del componente aggiuntivo ChromEdit Plus.
NOTA: prestare molta attenzione a ciò che si consente durante l'installazione di estensioni e altro software. Se non sei sicuro del prodotto o non ti fidi dell'azienda, non installarlo. Abbiamo testato ChromEdit Plus e lo abbiamo trovato sicuro e affidabile.
Viene visualizzata la finestra di dialogo Installazione del software. Fare clic su Installa ora, che potrebbe non essere disponibile fino al termine del conto alla rovescia.
NOTA: puoi modificare la durata del conto alla rovescia sul pulsante Installa , ma sconsigliamo di disattivarlo.
È necessario riavviare Firefox per completare l'installazione. Fare clic su Riavvia ora nella finestra di dialogo popup.
Una volta riavviato Firefox, il pulsante ChromEdit Plus viene aggiunto a destra della casella Indirizzo. Fare clic per aprire la finestra di ChromEdit Plus.
Ci sono tre schede per impostazione predefinita nella finestra di ChromEdit Plus. Modificheremo il file userChrome.css, che si trova nella prima scheda. Se la scheda è vuota, copia e incolla il testo seguente nella scheda userChrome.css e fai clic su Salva. Questo ti dà un file userChrome.css predefinito.
@namespace url ("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
# appmenu-button {
sfondo: #orange! important;
}
# appmenu-button dropmarker: before {
contenuto: "Firefox"! importante;
colore: #FFFFFF! important;
}
# appmenu-button .button-text {
display: nessuno! importante;
}
Potresti già avere un file userChrome.css, nel qual caso ci sarà già del testo nella scheda userChrome.css. Copia tutto il testo sopra eccetto la prima riga, la riga @namespace, e incollalo sulla scheda da qualche parte dopo la riga @namespace. Se vuoi conservare ciò che hai già, puoi incollare il testo sopra alla fine del file.
IMPORTANTE: assicurati che tutte le virgolette in userChrome.css NON siano virgolette intelligenti, comprese quelle nella riga @namespace. Dovrebbero essere citazioni normali e dirette. Se qualcuno di questi sono virgolette intelligenti, il file non influenzerà affatto l'aspetto di Firefox.
Fare clic su Riavvia per riavviare Firefox utilizzando il file userChrome.css nuovo o modificato.
In questo esempio, cambieremo il colore di sfondo in un blu scuro e cambieremo il testo "Firefox" in "How-To Geek".
Per cambiare il colore di sfondo, cambia il testo "#orange" sulla riga "background" nella sezione "# appmenu-button" con un colore diverso, utilizzando il codice colore esadecimale o il codice colore HTML. Ad esempio, abbiamo scelto un blu scuro con il codice colore esadecimale # 2C4362.
NOTA: per capire il codice esadecimale del colore desiderato, consulta i nostri articoli su ottenere codici colore esadecimali da colori RGB decimali , selezionando i colori da qualsiasi punto dello schermo , e ottenere codici colore in più formati .
Per modificare il testo sul pulsante, modificare il testo "Firefox" nella riga "contenuto" nella sezione "# appmenu-button dropmarker: before" con il testo desiderato, ad esempio "How-To Geek". Abbiamo aggiunto uno spazio dopo il testo per avere più spazio tra il testo e la freccia a discesa sul pulsante.
Puoi anche scegliere di cambiare il colore del testo cambiando la linea "color" nella stessa sezione "# appmenu-button dropmarker: before". Abbiamo lasciato il colore del testo come bianco (#FFFFFF), ma puoi cambiarlo in qualcosa di simile a un grigio chiaro (# F2F2F2) o qualcosa del genere.
Fare clic su Salva e quindi su Riavvia per rendere effettive le modifiche.
Il pulsante è ora blu scuro e dice "How-To Geek".
Puoi anche aggiungere un'immagine di sfondo al pulsante, oltre a cambiare il colore dello sfondo. Abbiamo creato un'immagine con la favicon How-To Geek a sinistra e uno sfondo trasparente in modo che il colore di sfondo blu scuro sia visibile. Per aggiungere un'immagine di sfondo al tuo pulsante, aggiungi la seguente riga alla sezione "# appmenu-button", cambiando il percorso tra virgolette alla posizione della tua immagine sul tuo computer. Lascia il "file: ///" nel percorso.
immagine di sfondo: url ("file: /// C: /Users/Lori/Pictures/htg_background.png")! important;
Fare clic su Salva e riavvia di nuovo.
Ora il nostro pulsante è completo.
Puoi anche personalizzare il pulsante del menu di Firefox convertendolo in un'icona. Ne abbiamo anche pubblicati molti altri suggerimenti e modifiche per ottenere il massimo da Firefox .