Première étape, accédez à votre panneau d'administration et cliquez sur l'onglet Affichage puis dans le menu Templates » Général. Dans la liste, sélectionnez le template index_body

Cherchez cette partie du template :

Code:

   <tr>
      <td class="row1"><span class="gensmall">{LEGEND} : {GROUP_LEGEND}</span></td>
   </tr>

C'est elle qui affiche la liste de vos groupes.

Vous notez la présence de deux variables de template (le texte en majuscules entre crochets) :
• {LEGEND}, qui affiche Légende, tout simplement
• {GROUP_LEGEND} qui affiche la liste de vos groupes

Pour pouvoir retirer les crochets ou personnaliser l'affichage des groupes plus en détail, vous allez devoir tout coder vous même, supprimez donc la variable {GROUP_LEGEND}.

Ce qui vous donne donc :

Code:

<tr>
      <td class="row1"><span class="gensmall">{LEGEND} : </span></td>
</tr>

Maintenant à la place de ce que vous avez supprimé, il faut ajouter ceci :

Code:

<a href="LIEN du GROUPE"><span style="color: #COULEUR;">NOM du GROUPE</span></a>

Répétez cette ligne autant de fois que vous avez de groupes sur votre forum.

» Pour trouver le lien du groupe, vous cliquez sur le groupe qui se trouve dans la légende d'origine et vous copiez l'adresse.
Cela peut donner ceci : http://www.css-actif.com/g1-administrateurs
Vous pouvez aussi simplifier le code en n'utilisant que cette partie : /g1- (en changeant le chiffre avec le bon identifiant du groupe bien sûr), ça marche aussi bien.

» A la place de #COULEUR, mettez la couleur de votre groupe. Pour la trouvez, rendez vous dans votre panneau d'administration, onglet Utilisateurs et groupes, puis dans Administration des groupes. Pour chaque groupe, cliquez sur le petit rouage jaune à côté et copiez la valeur dans le champ Couleur des membres du groupe

Quand vous avez tout rempli, les couleurs, les noms et les liens, vous aurez quelque chose comme ceci :

Code:

<tr>
   <td class="row1"><span class="gensmall">{LEGEND} : ~
      <a href="/g5-"><span style="color: #FF5900;">Fondateur</span>
      ~
      <a href="/g2-"><span style="color: #26A0BF;">Administrateurs</span></a>
      ~
      <a href="/g4-"><span style="color: #701649;">Codeurs</span></a>
      ~
      <a href="/g2-"><span style="color: #7FB015;">Modérateurs</span></a>
      ~
      <a href="/g3-"><span style="color: #000000;">Membres</span></a>
   </span></td>
</tr>

» Dans cet exemple, vous voyez un petit symbole ~ entre chaque ligne, qui permet de séparer chaque groupe, mais vous pouvez aussi utiliser un saut de ligne (balise < br / >) ou d'autres symboles.

» Si vous voulez retirer le nom Légende aussi, enlevez simplement cette partie :

Code:

{LEGEND} : 

Et je rappelle :


Bonne chance !