Comment changer l'apparence de la barre orange dans Firefox

J'aime la façon dont Firefox peut être personnalisé. Je veux dire qu'il n'y a rien dans le navigateur qui ne puisse être modifié ou modifié en fonction des besoins et du confort de l'utilisateur. Du point de vue fonctionnel, les préférences de configuration peuvent être modifiées pour réaliser presque tout, mais sur le plan esthétique, nous avons des composants CSS que l’on peut définir pour modifier l’apparence de l’interface.

Nous examinerons le bouton orange de Firefox situé en haut à gauche du navigateur et verrons comment son apparence peut être modifiée. Par exemple, regardez l'image (ci-dessous) et notez comment j'ai changé la couleur d'orange en rouge, le texte de blanc en noir et de Firefox à. Intéressant, non?

Voici comment vous pouvez apporter des modifications similaires.

Étapes pour personnaliser l'apparence du bouton Firefox

Chaque profil que vous créez sur Firefox est associé à un fichier CSS. Il est destiné aux entrées de l'utilisateur pour faire varier l'affichage du navigateur. Au cours du processus, nous vous indiquerons également comment trouver ce fichier ou en créer un s'il n'existe pas.

Étape 1: Ouvrez Firefox et accédez à Firefox (bouton orange) -> Aide -> Informations de dépannage.

Étape 2: Un nouvel onglet sera lancé. Recherchez la section intitulée Principes de base de l'application. Pour accéder à votre dossier de profil, cliquez sur le bouton Afficher le dossier. Il est conseillé d'ouvrir le dossier de profils à partir d'ici car s'il existe plusieurs profils, vous ne savez peut-être pas lequel est utilisé.

Étape 3: Dans votre répertoire de profil, vous trouverez un dossier appelé chrome. Si vous ne trouvez pas cela, vous pouvez en créer un.

Étape 4: Dans ce dossier, il devrait y avoir un fichier nommé userChrome.css. Le nom devrait être exactement comme orthographié ici.

Encore une fois, si vous ne le trouvez pas, vous pouvez en créer un. Si c'est le cas, passez à l'étape 7. Sinon, passez à l'étape 5.

Étape 5: Cliquez avec le bouton droit de la souris sur un espace vide et créez un nouveau -> document texte. Une fois cela fait, ouvrez le fichier avec Notepad.

Étape 6: Maintenant, allez dans Fichier et enregistrez sous le document en tant que userChrome.css. Assurez-vous que vous modifiez le type d' enregistrement en tant que Tous les fichiers à partir du bas de la boîte de dialogue Enregistrer. Cliquez sur Enregistrer et fermez le document.

Étape 7: Ouvrez le fichier userChrome.css avec le Bloc-notes. Faites simplement un clic droit sur le fichier et choisissez Ouvrir avec -> Bloc-notes.

Étape 8: Copiez l'extrait de code ci-dessous (tel quel) et ajoutez-le au fichier. Enregistrez les modifications.

@namespace url (“http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul”);

# appmenu-button {

fond: # orange ! important;

}

# appmenu-button dropmarker: before {

contenu: “ Firefox ”! important;

couleur: # FFFFFF ! important;

}

# appmenu-button.button-text {

affichage: aucun! important;

}

Notez les morceaux en gras. Ils représentent respectivement la couleur du bouton, le texte et la couleur du texte. Afin de changer l'apparence du bouton, vous pouvez modifier ces valeurs. Voici le code qui correspond à l'image que vous avez vue au début.

Si vous ne connaissez pas les codes Hex, vous pouvez vous référer à ce lien. Ou vous pouvez vérifier celui-ci.

Conclusion

Ce changement est juste un mineur. Si vous maîtrisez les codes, vous pourrez transformer presque tout ce que vous avez dans Firefox. Si vous utilisez certains de ceux que vous utilisez depuis toutes ces années, partagez-les avec nos lecteurs et aidez-les à faire sourire les nouveaux utilisateurs de Firefox.