Personnalisez l'affichage du forum sur votre ordinateur

Quelques règles à respecter pour préserver l'harmonie du forum.
Répondre
Avatar du membre
Chamane
Administratrice
Messages : 4850
Enregistré le : 18 janv. 2016 18:08
Fiche de présentation : viewtopic.php?p=84383
Localisation : Dans cette zone sombre et feuillue, précisément là où personne d'autre ne peut s'aventurer
Gender :
Terre

Personnalisez l'affichage du forum sur votre ordinateur

Message par Chamane »

Bonjour à tous !

Suite à la modification des coloris pour les noms des membres, je suis de ceux qui ont des problèmes de contraste avec le nouveau gris.
Distinguer rapidement les noms dans le flux de texte me demande un effort supplémentaire, nuit à mon plaisir de parcourir le forum, et me fatigue un peu :lol:

Pour tous ceux qui ont le même problème, voici un tuto pour changer la couleur du nom des utilisateurs.
/!\ Attention, ce tuto est réservé aux utilisateurs de Firefox.
(il doit exister d'autres astuces pour les autres navigateurs, mais ne les pratiquant pas, je n'ai pas cherché)

Quelques explications préalables
Firefox utilise 2 fichiers qui permettent à l'utilisateur (vous) de modifier l'aspect de l'interface de Firefox, et le rendu des pages web visitées.
Celui qui nous intéresse se nomme userContent.css.
Il doit se trouver dans le sous-répertoire chrome de votre profil utilisateur.
A l'aide de ce fichier, avec le code approprié, on peut outrepasser le style défini par le site web pour imposer le nôtre, avec un degré de détail intéressant. Ce changement de style a lieu uniquement au niveau de votre navigateur, pour le profil utilisateur concerné, et vous serez donc seul(e) à voir cette modification.

Pour restaurer la couleur orange des membres simples, voici la marche à suivre détaillée :

1. accédez au répertoire de votre profil utilisateur
  • Dans la barre d'adresse de Firefox, entrez le texte suivant about:profiles puis validez. Un tableau apparaît alors.
  • Cliquez sur le bouton Open Folder situé sur la ligne Root Directory. Une fenêtre d'explorateur Windows s'ouvre. Elle pointe directement dans le répertoire de votre profil et affiche son contenu.
2. Créez le fichier userContent.css
  • Dans le répertoire dont le contenu est affiché, localisez le sous-répertoire chrome. S'il n'existe pas, créez le. Double-cliquez pour aller dedans. Il est théoriquement vide.
  • Dans ce sous-répertoire, si vous êtes un utilisateur normal, il n'y aura rien. Créez alors un fichier nommé userContent.css. (Si vous êtes un utilisateur avancé, vous aurez peut-être déjà créé ce fichier et bidouillé... la création du fichier est alors inutile ^^)
3. Editez le fichier userContent.css
  • Cliquez-droit sur le fichier, et sélectionnez "Ouvrir avec / Bloc-notes". Vous pouvez utiliser un autre éditeur de texte simple (notepad++ par exemple). /!\ En revanche, n'utilisez surtout pas Word ou un autre éditeur de texte formaté. Le fichier contiendrait alors tout un tas de codes dont Firefox ne saura que faire, et l'astuce proposée ici ne fonctionnera pas.
4. Copiez-collez le code suivant dans le fichier userContent.css, sans rien omettre (y compris le petit point qu'on ne voit pas bien devant username) :

code : Tout sélectionner

.username-coloured[style="color: #85848A;"]{
	color: #ff992c !important;
}

span.username-coloured{
	font-size: 120% !important;	
}
5. Sauvegardez le fichier et fermez le.

6. (Re)démarrez Firefox

Et voilà ! :party:

Note 1 : la partie du code avec span.username-coloured est optionnelle. Elle permet simplement d'augmenter la taille de la fonte pour votre pseudo dans le menu déroulant du haut, le rendant ainsi plus visible.

Note 2 : la couleur orange a pour code #ff992C. Si vous voulez une autre couleur, modifiez ce code hexadécimal à votre convenance. Attention toutefois à ne pas changer les espaces, etc. sans quoi il y a un risque que le changement de couleur ne fonctionne pas.



N'hésitez pas à revenir vers moi si vous avez des problèmes, j'assure le dépannage en ligne à un prix très compétitif !
Bisous à tous !
En toute chose, en tout lieu, à chaque instant, j'apprends.

Sarah Lywandael sur GoodReads, Babelio, Booknode, Étherval
Nouvelles publiées : Partenaires, toujours (Nova Natura, éd. L'Imagin'Arche), Myriam (éd. Réticule), Clouds (Étherval, n°21, éd. Les plumes de l'Imaginaire)
Avatar du membre
Chamane
Administratrice
Messages : 4850
Enregistré le : 18 janv. 2016 18:08
Fiche de présentation : viewtopic.php?p=84383
Localisation : Dans cette zone sombre et feuillue, précisément là où personne d'autre ne peut s'aventurer
Gender :
Terre

Augmenter la taille du petit bouton d'accès au dernier post

Message par Chamane »

reBonjour à tous !

Je poste à la suite du message précédent, car tout repose sur la même astuce.
(j'aurais dû nommer le sujet : "Personnalisez votre affichage du forum sous Firefox")

Il s'agit aujourd'hui d'augmenter les dimensions du petit bouton gris avec une flèche à 45 °, permettant d'ouvrir le dernier message d'un sujet.
Ses mensurations par défaut étant lilliputiennes, j'ai le plus grand mal à cliquer dessus avec ma souris récalcitrante.

La marche à suivre est identique à celle permettant de personnaliser la couleur du nom des membres, hormis pour le point 4 que voici :
4. Copiez-collez le code suivant dans le fichier userContent.css, sans rien omettre (si vous avez déjà quelque chose dans votre fichier userContent.css, collez à la suite, après avoir sauté 1 ou 2 lignes) :

code : Tout sélectionner

/* Changement de la taille du petit carré pour accéder aux posts directement */
i[class="icon fa-external-link-square fa-fw icon-lightgray icon-md"]{
	font-size:16px !important;
}
Et VOILAAAAA ! :party:

Si vous avez besoin de personnaliser autre chose, demandez-moi, je me ferai un plaisir de hacker le forum ;)

Note : la valeur 16px marche bien pour moi. N'hésitez pas à expérimenter avec d'autres valeurs, celle du bouton d'origine étant de 10px.
En toute chose, en tout lieu, à chaque instant, j'apprends.

Sarah Lywandael sur GoodReads, Babelio, Booknode, Étherval
Nouvelles publiées : Partenaires, toujours (Nova Natura, éd. L'Imagin'Arche), Myriam (éd. Réticule), Clouds (Étherval, n°21, éd. Les plumes de l'Imaginaire)
Avatar du membre
Chamane
Administratrice
Messages : 4850
Enregistré le : 18 janv. 2016 18:08
Fiche de présentation : viewtopic.php?p=84383
Localisation : Dans cette zone sombre et feuillue, précisément là où personne d'autre ne peut s'aventurer
Gender :
Terre

Mettre en rouge les titres des sujets non lus

Message par Chamane »

Avez-vous comme moi des difficultés à localiser les sujects actifs non lus grâce à la petite balise à gauche (rouge ou grise en fonction de l'état) ?

Pas de problème ! Chamane à la rescousse invoque l'esprit des puces de silicium et vous montre comment mettre TOUS le titre en rouge pétant !
Même astuce que précédemment, avec encore une fois le §4 légèrement modifié.

4. Copiez-collez le code suivant dans le fichier userContent.css, sans rien omettre (si vous avez déjà quelque chose dans votre fichier userContent.css, collez à la suite, après avoir sauté 1 ou 2 lignes) :

code : Tout sélectionner

/* Mise en rouge des titres de sujets non lus */
a[class="unread"] + a{
	color: #FF0000 !important;
}
:party: :party: :party:
Si vous avez d'autres besoins, d'autres idées, n'hésitez pas à demander !

Note : la valeur #FF0000 correspond au rouge vif. Vous pouvez la modifier à votre guise, sachant que la structure de cette valeur est la suivante : #RRGGBB, où RR, GG, et BB sont des valeurs allant de 00 (le plus sombre) à FF (le plus clair) pour le Rouge, le Vert (Green), et le Bleu. Amusez-vous bien !
En toute chose, en tout lieu, à chaque instant, j'apprends.

Sarah Lywandael sur GoodReads, Babelio, Booknode, Étherval
Nouvelles publiées : Partenaires, toujours (Nova Natura, éd. L'Imagin'Arche), Myriam (éd. Réticule), Clouds (Étherval, n°21, éd. Les plumes de l'Imaginaire)
Avatar du membre
Chamane
Administratrice
Messages : 4850
Enregistré le : 18 janv. 2016 18:08
Fiche de présentation : viewtopic.php?p=84383
Localisation : Dans cette zone sombre et feuillue, précisément là où personne d'autre ne peut s'aventurer
Gender :
Terre

Personnalisation sous Google Chrome :devil:

Message par Chamane »

J'en entends déjà soupirer d'aise !

Parce que franchement, Chamane, elle est bien gentille avec son renard enflammé, mais il ne représente plus que 6% des utilisateurs (statistiques de février 2021), contre 81 % pour cette méphitique émanation du mal qu'est Google Chrome :devil: .
(en plus, c'est même pas le plus rapide... :lol:)

Mais bon, il faut de tout pour faire un monde... Alors voilà enfin le portage des astuces précédentes sur Google Chrome :devil:
*sort un crucifix, un totem de protection, un grigri du Niokolo Koba, et le numéro d'un exorciste (on ne sait jamais)*

Tout ce que j'ai écrit dans le premier post reste valable, sauf que le fichier à créer va se nommer Custom.css et se trouver dans un autre répertoire. Pour le reste, il vous suffira de copier/coller les bouts de code en bleu dans ce fichier, et ça marchera.

1. accédez au répertoire des fiches de style personnalisées par l'utilisateur
  • Pour Google Chrome, le répertoire se trouve à l'adresse suivante (pour Windows) : C:\Users\NomDeL'Utilisateur\AppData\Local\Google\Chrome\User Data\Default\User StyleSheets\. NomDeL'utilisateur est bien sûr à remplacer par votre nom d'utilisateur. Si vous vous connectez sous Windows avec la session utilisateur "Scribouillard", alors l'adresse correspondante sera C:\Users\Scribouillard\AppData\Local\Google\Chrome\User Data\Default\User StyleSheets\
2. Créez le fichier Custom.css
  • Créez le fichier nommé Custom.css. (Si vous êtes un utilisateur avancé, vous aurez peut-être déjà créé ce fichier et bidouillé... la création du fichier est alors inutile ^^)
3. Editez le fichier Custom.css
  • Cliquez-droit sur le fichier, et sélectionnez "Ouvrir avec / Bloc-notes". Vous pouvez utiliser un autre éditeur de texte simple (notepad++ par exemple). /!\ En revanche, n'utilisez surtout pas Word ou un autre éditeur de texte formaté. Le fichier contiendrait alors tout un tas de codes dont Firefox ne saura que faire, et l'astuce proposée ici ne fonctionnera pas.
4. Copiez-collez l'un des codes déjà donné - ou l'un de ceux qui suivra - dans Custom.css, sans rien omettre) :

5. Sauvegardez le fichier et fermez le.

6. (Re)démarrez Chrome

Et voilà ! :party:

Chrome n'est pas installé sur mon PC (Google, c'est le :devil: ). Donc je n'ai pas pu tester ce tuto. S'il y a un problème, contactez-moi en MP, et je tenterai de trouver une solution
En toute chose, en tout lieu, à chaque instant, j'apprends.

Sarah Lywandael sur GoodReads, Babelio, Booknode, Étherval
Nouvelles publiées : Partenaires, toujours (Nova Natura, éd. L'Imagin'Arche), Myriam (éd. Réticule), Clouds (Étherval, n°21, éd. Les plumes de l'Imaginaire)
Avatar du membre
Hunter092
Messages : 314
Enregistré le : 10 févr. 2020 19:21
Gender :
Terre

Re: Personnalisez l'affichage du forum sur votre ordinateur

Message par Hunter092 »

Eh ben, on dirait que tu apprécies autant Chrome qu'un humain lambda apprécie Halo 5, Minecraft Pocket Edition ou les films Percy Jackson et The Maze Runner 2 et 3...

PS : je me doute que peu d'entre vous sont des humains lambda
« La logique vous mènera d’un point A à un point B. L’imagination vous mènera partout. »
— Albert Einstein
Avatar du membre
Chamane
Administratrice
Messages : 4850
Enregistré le : 18 janv. 2016 18:08
Fiche de présentation : viewtopic.php?p=84383
Localisation : Dans cette zone sombre et feuillue, précisément là où personne d'autre ne peut s'aventurer
Gender :
Terre

Restreindre l'application des styles à ce forum uniquement

Message par Chamane »

Bonjour à tous !

Les astuces que j'ai proposées ont le désagréable inconvénient d'être globales : en l'état, elles s'appliquent à tout site, quel qu'il soit.
Aussi, voici une méthode pour restreindre leur champ d'application au forum :

Toujours dans le même fichier userContent.css, ajoutez les lignes suivantes :

Avant le bloc d'instructions contenant les modifications :
  • Pour Chrome : (sans garantie, je n'ai pas pu tester)

    code : Tout sélectionner

    @document domain("ecrire-un-roman.com") {
Après ledit bloc d'instructions : pour refermer l'accolade ouverte plus haut.

C'est fini !
Les styles utilisateurs situés entre les accolades ne s'appliqueront plus désormais qu'au domaine ecrire-un-roman.com.
En toute chose, en tout lieu, à chaque instant, j'apprends.

Sarah Lywandael sur GoodReads, Babelio, Booknode, Étherval
Nouvelles publiées : Partenaires, toujours (Nova Natura, éd. L'Imagin'Arche), Myriam (éd. Réticule), Clouds (Étherval, n°21, éd. Les plumes de l'Imaginaire)
Répondre