Darkoneko's Weblog

Yesterday, today, and no future / time waits for no one

Personnalisons Wikipédia : changer l’apparence du « vous avez un nouveau message » (2)

Posted by DarkoNeko sur samedi 15 août 2009

Ce billet fait partie de la série « Personnalisons Wikipédia« .

La personnalisation d’aujourd’hui vous permettra de changer l’apparence  du sempiternel « vous avez un nouveau message » (voire le cacher) à l’aide d’un peu de CSS  – à ne pas confondre avec mon billet d’hier qui indiquait comment en changer le texte (et qui explique pourquoi j’ai un truc louche dans mes captures d’écran ci dessous :)

Les codes d’aujourd’hui utilisent des notions CSS déjà vues dans les précédents billets, elles ne seront donc pas détaillées ici.

Le div sur lequel nous travaillons possède la classe « usermessage ». Faites vous faire un édit sur votre page de discussion, et il vous suffira de prévisualiser votre code (le bandeau apparaissant sur la page de monobook que vous serez en train d’éditer) jusqu’à être satisfait des couleurs.

En rouge


.usermessage {
  background-color:#FAA;
  border-color:red;
}

vousAvezFaitUneconnerie-rouge

En bleu


.usermessage {
  background-color:lightblue;
  border-color:blue;
}

vousAvezFaitUneconnerie-bleu

En vert


.usermessage {
  background-color:lightgreen;
  border-color:green;
}

vousAvezFaitUneconnerie-vert

En jaune

(celui là me pique un peu les yeux)


.usermessage {
  background-color:lightyellow;
  border-color:yellow;
}
vousAvezFaitUneconnerie-jaune



ou en un peu plus foncé,


.usermessage {
  background-color:yellow;
  border-color:#0AA;
}

vousAvezFaitUneconnerie-jaune2

Voire transparent

J’ai laissé la bordure, mais c’est retirable aussi (border:0px; ou mettez la couleur en transparent)


.usermessage {
  background-color:transparent;
  border-color:#CCC;
}

vousAvezFaitUneconnerie-transparent

Divers

Réduire la taille du bouzin et masquer l’image par défaut


.usermessage {
  font-size:x-small;
  padding:1px 10px; /* marge interne du div : 1px en hauteur, 10px en largeur */
  width:250px;
  /* ici les couleurs que vous voulez ; perso j'ai choisi bleu */
}

.usermessage img {
  display:none;
}

vousAvezFaitUneconnerie-bleu-mini


Faire clignoter le texte (pour les plus masochistes d’entre vous) :

   text-decoration:blink;

En dernier recours, si vous n’en pouvez plus, vous pouvez aussi faire totalement disparaitre le bandeau


.usermessage {
  display:none;
}

Et voili le travail

Advertisements

4 Réponses to “Personnalisons Wikipédia : changer l’apparence du « vous avez un nouveau message » (2)”

  1. chandres said

    Excellent ta série sur la personnalisation, vraiment bien faite. Par contre demander un copain d’éditer sa page de discussion pour faire le test… je sais pas, y’en a qu’on essayé, ca a pas bien fini!! ;-)

  2. Mathieu P. said

    J’adopte. Merci !

  3. Tu es grand et fort. Respect.

Sorry, the comment form is closed at this time.