[CSS/HTML] Liens des sous-forums en vignette

Bonjour (:

Alors, cette fois-ci, nous allons apprendre comment mettre les liens des sous-forums en vignettes x).
C'est un code, je préviens, qui se met manuellement en partie et qui demande du temps à être mis en place en html. (mais qui est très simple, je rassure).

Aperçu de l'effet (pris sur un forum que j'ai codé)


1ère étape ; css

C'est simple, placez ce code ;

Code:

 .vignettes
{-moz-border-radius:7px;
background-color: #CODE;
padding-right:10px;
padding-left:10px;
padding-bottom: 3px;
padding-top:3px;
color : #CODE;}

Dans votre feuille de style. Vous pouvez tout modifier (rappel ; -moz-border-radius gère l'arrondissement de votre vignette, background-color est la couleur du fond, le padding détermine la marge interne de votre vignette et la couleur de fin, la couleur du texte).


2ème étape ; html

De un, allez désactiver les liens naturels des sous-forums (à savoir affichage -> Structure et hiérarchie -> liens vers les niveaux inférieurs ; non)
Ensuite, allez dans configuration -> catégories et forums.
Cliquez sur un de vos forums ayant un sous-forum.
Placez ce code-ci dans la description :

Code:

<a class="vignettes" href="LIEN DU SOUS-FORUM">TITRE</a>

(la balise <*a class permet la communication entre le css et le html sur votre forum. Votre class vignette est disponible aussi où vous voulez, dans vos messages, etc).
Si la mise en place est si longue, c'est parce qu'il faut faire ça sur chacun de vos forums pour afficher vos sous-forums.
Vous pouvez le centrer, le modifier via le css comme bon vous semble... la personnalisation dépend de vous