Savez-vous qu’il est possible de changer la manière dont Firefox présente ses menus, ses barres d’outils et même l’emplacement des boutons de navigation en changeant seulement quelques lignes de code dans un fichier CSS ? Vous pouvez réorganiser pas mal d’éléments en quelques secondes seulement. Voici un petit mode d’emploi en 4 étapes.

Etape 1 : création du fichier userChrome.css

Rendez-vous dans le dossier de votre profil Firefox qui se trouve à l’emplacement C:\Documents and Settings\*username*\Application Data\Mozilla\Firefox\Profiles\*chaîne_aléatoire*.default\Chrome\. Vous trouvez un fichier qui s’appelle userChrome-example.css, renommez-le en userChrome.css. S’il n’existe pas, créez-le. Votre fichier CSS est maintenant prêt à être édité.

Etape 2 : édition du fichier userChrome.css

Voici les modifications que j’ai apporté à mon installation de Firefox grâce aux CSS. Vous pouvez coller chacun de ces extraits dans votre userChrome.css. La première partie est vitale :


/* Edit this file and copy it as userChrome.css into 
 * your profile-directory/chrome/ */

/* Do not remove the @namespace line -- it's 
 * required for correct functioning */
@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); 
/* set default namespace to XUL */

Nettoyons un peu la barre de navigation et la présentation générale :


/*  Suppression du throbber en haut à droite */
#throbber-box 
{
   display: none !important;
}

/* La boite de recherche doit faire cette taille */
#searchbar
{
	width: 188px !important;
} 

/* On veut une barre d'adresse conséquente ! */
#addressbar, #urlbar
{
	width: 588px !important;
}

Enlevons maintenant les menus qui ne nous servent pas ou peu :

/* Retirer les menus Edition, Aller et Aide 
 * Sauvegarder le fichier en UTF-8 pour les accents ! */
menu[label="Aller à"], 
menu[label="?"], 
menu[label="Edition"] 
{
   display: none !important;
}

Et enfin, présentons la barre d’outils de manière plus efficace :


/* Montrer les boutons Stop & Reload intelligemment */
#stop-button[disabled] {    display: none !important;}
#stop-button:not([disabled]) + #reload-button {
	display: none !important;
}

/* Adoucit les apparitions de boutons dans la barre 
 * d'outils. Applicable à bien des boutons ! */
#stop-button
{
   opacity: 1 !important;
}
#stop-button[disabled="true"]
{
   opacity: 0 !important;
}

/* Cache les boutons suivant/précédent quand ils sont
 * indisponibles */
#back-button[disabled="true"],
#forward-button[disabled="true"]
{
   display: none !important;
}

/* Plus de lien "précédent" dans le menu contextuel
 * s'il n'y a pas de page précédente dans l'onglet */
menuitem[disabled="true"]
{
   display: none !important;
}

Etape 3 : comment savoir quelles sont les propriétés à éditer ?

C’est une question à laquelle la fondation Mozilla elle-même n’a pas de réponse mais elle propose toutefois deux ressources : une liste des IDs pour retirer ou ajouter des éléments et une autre liste pour améliorer l’interface graphique (skinning). Je vous conseille Notepad++ pour l’édition de votre feuille CSS : la coloration syntaxique aide grandement l’édition et il est très aisé d’enregistrer au format UTF-8 (Format > Encoder en UTF-8), chose que le bloc-note ou Wordpad sont incapables de faire correctement.

A lire :  Ajouter un flux MP3 à votre radio IceCast

Voilà, vous devriez avoir un Firefox quelque peu allégé sur le plan graphique. Il existe des tonnes de modifications possibles, reportez-vous donc au paragraphe précédent pour plus d’idées. Happy modding !

Pour développer votre projet WordPress ou Woocommerce, faites appel à mon expertise pour réaliser un site rapide, performant et fonctionnel.

Contactez-moi

Si vous avez trouvé une faute d’orthographe, informez-nous en sélectionnant le texte en question et en appuyant sur Ctrl + Entrée s’il vous plaît.

Articles en rapport:

Modifier l’apparence de Firefox grâce aux feuilles CSS

par Matt Lecture: 3 min
2

Pin It on Pinterest

Share This

Spelling error report

The following text will be sent to our editors: