Pour réaliser ce tuto vous devez être le fondateur de votre forum pour avoir accès aux templates[/i]
● Tout d'abord trouver le template Index_box (panneau d'administration -> affichage -> templates)
● Trouver
- Code:
-
<th nowrap="nowrap" width="50">{L_TOPICS}</th>
<th nowrap="nowrap" width="50">{L_POSTS}</th>
<th nowrap="nowrap" width="150"><div style="width:150px;">{L_LASTPOST}</div></th>
Vous pouvez le trouver à l'aide de Ctrl+F
Ceci représente le nom de chaque colonne :
{L_TOPICS} = sujets
{L_POSTS} = messages
{L_LASTPOST} = derniers messages
● Nous allons maintenant rassembler les catégories en une seule colonne. C'est plus esthétique hein :POn va commencer en supprimant au code précédent cette partie :
- Code:
-
<th nowrap="nowrap" width="50">{L_TOPICS}</th>
<th nowrap="nowrap" width="50">{L_POSTS}</th>
</th>
● Ensuite vous allez trouver ce code :
- Code:
-
<td class="row3" align="center" valign="middle" height="50">
<span class="gensmall">{catrow.forumrow.TOPICS}</span>
</td>
<td class="row2" align="center" valign="middle" height="50">
<span class="gensmall">{catrow.forumrow.POSTS}</span>
</td>
<td class="row3 over" align="center" valign="middle" height="50">
<span class="gensmall">{catrow.forumrow.LAST_POST}</span>
</td>
et vous coupez cette partie (Ctrl+X) :
- Code:
-
<td class="row3" align="center" valign="middle" height="50">
<span class="gensmall">{catrow.forumrow.TOPICS}</span>
</td>
<td class="row2" align="center" valign="middle" height="50">
<span class="gensmall">{catrow.forumrow.POSTS}</span>
</td>
il ne vous reste donc que ça :
- Code:
-
<td class="row3 over" align="center" valign="middle" height="50">
<span class="gensmall">{catrow.forumrow.LAST_POST}</span>
</td>
Vous venez donc de supprimer les deux colonnes sujets & messages.
● Alors maintenant vous trouvez ce code normalement il est sous vos yeux :
- Code:
-
<span class="gensmall">{catrow.forumrow.LAST_POST}</span>
avec le code que vous avez coupé tout à l'heure vous le rajoutez avec ce code. Voilà le résultat :
- Code:
-
<td class="row3" align="center" valign="middle" height="50">
<span class="gensmall">{catrow.forumrow.TOPICS}</span>
</td>
<td class="row2" align="center" valign="middle" height="50">
<span class="gensmall">{catrow.forumrow.POSTS}</span>
</td><span class="gensmall">{catrow.forumrow.LAST_POST}</span>
● Ensuite vous enlevez tous les TD :
- Code:
-
<span class="gensmall">{catrow.forumrow.TOPICS}</span>
<span class="gensmall">{catrow.forumrow.POSTS}</span>
<span class="gensmall">{catrow.forumrow.LAST_POST}</span>
et enfin vous rassemblez tout ça en une span, voilà le résultat :
- Code:
-
<span class="gensmall">{catrow.forumrow.TOPICS} sujets avec {catrow.forumrow.POSTS} messages </span>
<span class="gensmall">{catrow.forumrow.LAST_POST}</span>
Bien évidemment vous pouvez changer sujets & messages avec ce que vous voulez cela ne tient qu'à vous
● On va maintenant personnaliser tout ça. Ça sera beaucoup plus esthétique. Pour cela on va rajouter des DIV que l'on modifiera par CSS. On va nommer les DIV Class message et dernier . Ce qui va donner :
- Code:
-
<div class="message"><span class="gensmall">{catrow.forumrow.TOPICS} sujets avec {catrow.forumrow.POSTS} messages </span> </div>
<div class="dernier"><span class="gensmall">{catrow.forumrow.LAST_POST}</span></div>
● Et voilà pour la partie CSS :
- Code:
-
.messages
{
background-color : #COLOR; /*Couleur de fond*/
color : #COLOR; /*Couleur du texte*/
width: XXXpx /*taille de la colonne*/
border: XXpx solid #color /*une bordure*/
}
.dernier
{
background-color : #COLOR; /*Couleur de fond*/
color : #COLOR; /*Couleur du texte*/
width: XXXpx /*taille de la colonne*/
border: XXpx solid #color /*une bordure*/
}
Bien évidemment vous pouvez changer le titre de la class comme vous le souhaitez, et modifier le CSS comme vous voulez.
Si vous avez des questions c'est par
ici