- InvitéInvité
[Templates & CSS] Supprimer la colonne Derniers Messages
Sam 24 Juil 2010, 11:42
Supprimer la colonne "Derniers Messages"
Niveau: Facile | Par: .Little Lady | Validé par: .Little Lady | En date du: 14.06.2010
Vous souhaitez démarquer votre forum des autres et le rendre original ? Vous souhaitez éviter l'affichage habituel des forums ?? Alors voici un petit tuto qui vous permettra de supprimer la colonne "Derniers Messages". Il vous suffira simplement de suivre étape par étape ce p'tit tuto.
Pour commencer, il faut être le Fondateur du forum car il nous faudra modifier les templates.
Allez dans le Panneau d'Administration >> Affichage >> Général >> Index_Box
I: - Suppression de la colonne "Derniers Messages" -
Pour commencer, nous allons supprimer ce qui sera inutile.
Dans votre template, cherchez et supprimez cette ligne.
- Code:
<th nowrap="nowrap" width="150"><div style="width:150px;">{L_LASTPOST}</div></th>
Ensuite, cherchez ceci:
- Code:
<td class="row3 over" align="center" valign="middle" height="50">
<span class="gensmall">{catrow.forumrow.LAST_POST}</span>
</td>
Supprimez ceci:
- Code:
<td class="row3 over" align="center" valign="middle" height="50">
et ceci:
- Code:
</td>
A ce moment, la colonne "Derniers Messages" n'existe plus sur votre forum. Maintenant, il faut bien mettre le texte de cette colonne quelque part. Je vous propose donc de le mettre dans la case de la description des sous-forums.
II: - Replacer les Statistiques -
Maintenant, il faut replacer les statistiques. Je vous propose donc de le mettre dans la case de la description des sous-forums.
Et pour cela nous avons besoin de la variable représentant ces statistiques; soit:
- Code:
<span class="gensmall">{catrow.forumrow.LAST_POST}</span>
Dans votre template, il vous faut donc localiser l'endroit où nous souhaitons le mettre, c'est-à-dire ici:
- Code:
<td class="{catrow.forumrow.INC_CLASS}" align="center" valign="middle">
<img title="{catrow.forumrow.L_FORUM_FOLDER_ALT}" src="{catrow.forumrow.FORUM_FOLDER_IMG}" alt="{catrow.forumrow.L_FORUM_FOLDER_ALT}" />
</td>
<td class="row1 over" colspan="{catrow.forumrow.INC_SPAN}" valign="top" width="100%" height="50">
<h{catrow.forumrow.LEVEL} class="hierarchy">
<span class="forumlink">
<a class="forumlink" href="{catrow.forumrow.U_VIEWFORUM}">{catrow.forumrow.FORUM_NAME}</a>
</span>
</h{catrow.forumrow.LEVEL}>
<span class="genmed">{catrow.forumrow.FORUM_DESC}</span>
<span class="gensmall">
<!-- BEGIN switch_moderators_links -->
{catrow.forumrow.switch_moderators_links.L_MODERATOR}{catrow.forumrow.switch_moderators_links.MODERATORS}
<!-- END switch_moderators_links -->
{catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}
Une fois que vous avez repéré ce morceau de code, il vous suffit de le remplacer par celui-ci:
- Code:
<td class="{catrow.forumrow.INC_CLASS}" align="center" valign="middle">
<img title="{catrow.forumrow.L_FORUM_FOLDER_ALT}" src="{catrow.forumrow.FORUM_FOLDER_IMG}" alt="{catrow.forumrow.L_FORUM_FOLDER_ALT}" />
</td>
<td class="row1 over" colspan="{catrow.forumrow.INC_SPAN}" valign="top" width="100%" height="50">
<h{catrow.forumrow.LEVEL} class="hierarchy">
<span class="forumlink">
<a class="forumlink" href="{catrow.forumrow.U_VIEWFORUM}">{catrow.forumrow.FORUM_NAME}</a>
</span>
</h{catrow.forumrow.LEVEL}>
<table>
<tr>
<td><span class="genmed">{catrow.forumrow.FORUM_DESC}</span>
<span class="gensmall">
<!-- BEGIN switch_moderators_links -->
{catrow.forumrow.switch_moderators_links.L_MODERATOR}{catrow.forumrow.switch_moderators_links.MODERATORS}
<!-- END switch_moderators_links -->
{catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}
</td>
<td>
<div class="messages_sujets_derniers_sujets">
<div class="derniers_sujets"><span class="gensmall">{catrow.forumrow.LAST_POST}</span></div>
</div>
</td>
</tr>
</table>
Vous avez pu vous apercevoir que j'ai ajouté deux div dans le code: messages_sujets_derniers_sujets & derniers_sujets.
Ces deux balises vous permettront de personnaliser l'affiche des statistiques avec du CSS.
Ça y est, vous avez bien suivi le tuto ?? Alors vous pouvez enregistrer et publier votre template.
III: - Personnaliser avec du CSS -
Il est évident que cela sera plus joli avec du CSS. Nous allons donc personnaliser tout ça alors préparez-vous. Pour cela, il faut ouvrir votre feuille CSS. Allez donc dans le Panneau d'Administration >> Affichage >> Couleurs >> Feuille de Style CSS
Maintenant, il faut mettre la class relative à nos "div" dans le template modifié; soit la class "messages_sujets_derniers_sujets" et la class "derniers_sujets".
Bien évidemment, vous pouvez personnaliser à votre façon ces div.
- Code:
.messages_sujets_derniers_sujets {
margin-left: VALEURpx; /*espace entre le bord gauche et la bordure*/
padding-top: VALEURpx; /*espace entre le texte et la bordure du haut*/
padding-left: VALEURpx; /*espace entre le texte et la bordure gauche*/
padding-bottom: VALEURpx; /*espace entre le texte et la bordure du bas*/
padding-right: VALEURpx; /*espace entre le texte et la bordure droite*/
border-top: VALEURpx solid #COULEUR;
border-left: VALEURpx solid #COULEUR;
border-bottom: VALEURpx solid #COULEUR;
-moz-border-radius-topleft: VALEURpx; /*arrondir l'angle gauche du haut*/
-moz-border-radius-bottomleft: VALEURpx;/*arrondir l'angle gauche du bas*/
}
/*affichage derniers messages*/
.derniers_sujets {
padding: VALEURpx; /*espace entre le texte et la bordure*/
margin: VALEURpx; /*espace entre le bord et la bordure*/
border: VALEURpx dashed #COULEUR;
-moz-border-radius-topleft: VALEURpx; /*arrondir l'angle gauche du haut*/
-moz-border-radius-bottomright: VALEURpx; /*arrondir l'angle droit du bas*/
text-align: center;
}
Voilà, nous arrivons à la fin de tuto. En espérant que celui-ci ait pu vous servir.
Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum