Modifier l'apparence des catégories et des forums
Forum gratuit : Le forum des forums actifs :: Entraide & Support... :: Problème avec un script, un code :: Archives des problèmes avec un code
Page 1 sur 1 • Partagez
Modifier l'apparence des catégories et des forums
Bonsoir (ou bonjour selon l'heure de lecture ^^)
Je suis fondatrice d'un forum et j'aimerais beaucoup modifier cette fameuse apparence des catégories et des forums en leur donnant un aspect particulier
Cependant au lieu que les boutons (new, no new, lock) soient à droite je voudrais qu'ils se trouvent à gauche.
Pour information, je n'ai encore modifié aucun template, je suis sous firefox, et mon css actuel est le suivant:
Alors si quelqu'un pouvait m'aider, ça serait très sympa. J'ai parcouru le forum avec la fonction recherche mais je n'ai pas trouvé ce que je voulais, évidemment je ne suis pas à l'abri d'avoir loupé quelque chose auquel cas, je m'en excuse d'avance.
Merci beaucoup.
Je suis fondatrice d'un forum et j'aimerais beaucoup modifier cette fameuse apparence des catégories et des forums en leur donnant un aspect particulier
- Spoiler:
Cependant au lieu que les boutons (new, no new, lock) soient à droite je voudrais qu'ils se trouvent à gauche.
Pour information, je n'ai encore modifié aucun template, je suis sous firefox, et mon css actuel est le suivant:
- Code:
body
{
background-position: top center;
background-repeat: no-repeat;
letter-spacing: 1px;
}
a
{
text-decoration: none;
font-variant: small-caps;
}
a {outline:none;}
a:hover
{
text-decoration: none;
}
#i_logo
{
background-image: url(http://host.image.files.free.fr/host/4a3f44e88bb33ban2.jpg);
background-position: top center;
background-repeat: no-repeat;
width: 1400px;
height: 500px;
margin-top: -18px;
margin-bottom: -60px;
margin-right: 14px;
}
#page-body
{
background-image: url(http://host.image.files.free.fr/host/4ab2601cebac6fond-interne.jpg);
background-position: top center;
background-repeat: repeat-y;
background-color: transparent;
width: 950px;
margin: auto;
}
table
{
max-width: 800px;
margin: auto;
}
Alors si quelqu'un pouvait m'aider, ça serait très sympa. J'ai parcouru le forum avec la fonction recherche mais je n'ai pas trouvé ce que je voulais, évidemment je ne suis pas à l'abri d'avoir loupé quelque chose auquel cas, je m'en excuse d'avance.
Merci beaucoup.
Dernière édition par Saranna le Ven 30 Sep 2011, 21:03, édité 3 fois
Re: Modifier l'apparence des catégories et des forums
Bonjour,
On va procédé par étape, et commencer par modifier les catégories. Dans le template index_box, on retire les en-têtes des colonnes sujet/message/dernier message.
Repérez ce morceau:
Ensuite on déplace le titre des catégories au dessus du tableau avec la class "forumline". Pour cela il faut recréer un petit tableau:
Repérez:
Les titres sont en place, mais les colonnes en dessous sont déformées. Donc il faut ajouter les dimensions dans cette partie:
Pour la suite, Il faut s'inspirer de ce tutoriel:
> Affichage des forums avec onglets
On ne va prendre que la partie qui nous intéresse (la partie CSS) et dans le template on remplace:
N'hésitez pas à poser des questions .
Cordialement.
On va procédé par étape, et commencer par modifier les catégories. Dans le template index_box, on retire les en-têtes des colonnes sujet/message/dernier message.
Repérez ce morceau:
- 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>
Ensuite on déplace le titre des catégories au dessus du tableau avec la class "forumline". Pour cela il faut recréer un petit tableau:
Repérez:
- Code:
<!-- BEGIN catrow --><!-- BEGIN tablehead --><table class="forumline" width="100%" border="0" cellspacing="1" cellpadding="0">
<tr>
<th colspan="{catrow.tablehead.INC_SPAN}" nowrap="nowrap" width="100%" class="secondarytitle"> {catrow.tablehead.L_FORUM} </th>
</tr>
<!-- END tablehead -->
<!-- BEGIN cathead -->
- Code:
<!-- BEGIN catrow --><!-- BEGIN tablehead --><table width="100%" border="0" cellspacing="0" cellpadding="0"><tr>
<td width="500"><div style="width:500px;"></div></td> <td colspan="{catrow.tablehead.INC_SPAN}" nowrap="nowrap" width="100%" class="secondarytitle"> {catrow.tablehead.L_FORUM} </td>
</tr></table><table class="forumline" width="100%" border="0" cellspacing="1" cellpadding="0">
<!-- END tablehead -->
<!-- BEGIN cathead -->
Les titres sont en place, mais les colonnes en dessous sont déformées. Donc il faut ajouter les dimensions dans cette partie:
- 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>
- Code:
<td class="row3" align="center" valign="middle" height="50" width="50"><div style="width:50;">
<span class="gensmall">{catrow.forumrow.TOPICS}</span>
</td>
<td class="row2" align="center" valign="middle" height="50" width="50"><div style="width:50px;">
<span class="gensmall">{catrow.forumrow.POSTS}</span>
</td>
<td class="row3 over" align="center" valign="middle" height="50" width="150"><div style="width:150px;">
<span class="gensmall">{catrow.forumrow.LAST_POST}</span></div>
</td>
Pour la suite, Il faut s'inspirer de ce tutoriel:
> Affichage des forums avec onglets
On ne va prendre que la partie qui nous intéresse (la partie CSS) et dans le template on remplace:
- Code:
</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}
</span>
</td>
<td class="row3" align="center" valign="middle" height="50" width="50"><div style="width:50px;">
<span class="gensmall">{catrow.forumrow.TOPICS}</span>
</td>
<td class="row2" align="center" valign="middle" height="50" width="50"><div style="width:50px;">
<span class="gensmall">{catrow.forumrow.POSTS}</span>
</td>
<td class="row3 over" align="center" valign="middle" height="50" width="150"><div style="width:150px;">
<span class="gensmall">{catrow.forumrow.LAST_POST}</span></div>
</td>
- Code:
<h{catrow.forumrow.LEVEL}>
<div class="forum-stats">{catrow.forumrow.POSTS} messages, dans {catrow.forumrow.TOPICS} sujets.</div>
<div class="forum-description">
<span class="genmed">{catrow.forumrow.FORUM_DESC}</span>
</div>
<div class="forum-sousforum">{catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}</div>
<span class="gensmall">
<!-- BEGIN switch_moderators_links -->
{catrow.forumrow.switch_moderators_links.L_MODERATOR}{catrow.forumrow.switch_moderators_links.MODERATORS}
<!-- END switch_moderators_links -->
</span>
</td>
<td class="row3 over" align="center" valign="middle" height="50"><div style="width:180px;">
<span class="gensmall">{catrow.forumrow.LAST_POST}</span></div>
</td>
N'hésitez pas à poser des questions .
Cordialement.
Dernière édition par Isolde le Mer 28 Sep 2011, 21:20, édité 1 fois
Invité- Invité
Re: Modifier l'apparence des catégories et des forums
Bonjour !
Tout d'abord merci d'avoir répondu à ma demande, ensuite pour les précisions voilà le petit croquis:
Si mon interprétation est exacte (je peux me tromper) le cadre rouge représente l'emplacement du bouton new, no new ou lock. Du coup moi j'aimerais le faire passer de l'autre côté du cadre intérieur.
Par contre j'ai un souci, j'arrive pas à accéder au tutoriel...(peut-être un souci de connexion).
Merci d'avance.
Tout d'abord merci d'avoir répondu à ma demande, ensuite pour les précisions voilà le petit croquis:
- Spoiler:
Si mon interprétation est exacte (je peux me tromper) le cadre rouge représente l'emplacement du bouton new, no new ou lock. Du coup moi j'aimerais le faire passer de l'autre côté du cadre intérieur.
Par contre j'ai un souci, j'arrive pas à accéder au tutoriel...(peut-être un souci de connexion).
Merci d'avance.
Re: Modifier l'apparence des catégories et des forums
Bonsoir,
J'ai modifié le lien du tutoriel dans mon message précédent , j'ai été trop vite, il manquait un bout de l'url, désolée .
Reprenons donc à la suite de mon message précedent. L'icone nouveau message est normalement du bon coté, puisque vous la voulez à gauche. Il ne reste plus qu'à placer les derniers messages dans la description.
Donc il faut supprimer ceci:
Cordialement..
J'ai modifié le lien du tutoriel dans mon message précédent , j'ai été trop vite, il manquait un bout de l'url, désolée .
Reprenons donc à la suite de mon message précedent. L'icone nouveau message est normalement du bon coté, puisque vous la voulez à gauche. Il ne reste plus qu'à placer les derniers messages dans la description.
Donc il faut supprimer ceci:
- Code:
<td class="row3 over" align="center" valign="middle" height="50"><div style="width:180px;">
<span class="gensmall">{catrow.forumrow.LAST_POST}</span></div>
</td>
- Code:
<div class="forum-description">
<span class="genmed">{catrow.forumrow.FORUM_DESC}</span>
</div>
- Code:
<div class="forum-description">
<table><tr><td style="width:75%;"><span class="genmed">{catrow.forumrow.FORUM_DESC}</span>
</div></td><td><div style="width:180px;">
<span class="gensmall">{catrow.forumrow.LAST_POST}</span></td></tr></table></div>
Cordialement..
Invité- Invité
Re: Modifier l'apparence des catégories et des forums
Je viens de terminer les manip et de ce que je vois ça correspond à ce que je veux par contre (je sais pas si c'est avec le CSS ou pas), j'ai pas le "cadre arrondi" autour du titre des grandes catégories (Sur l'illustration ce qui encadre "Votre 1ère catégorie".
Cordialement ^^
Saranna
Cordialement ^^
Saranna
Re: Modifier l'apparence des catégories et des forums
Bonsoir,
Exact, j'ai oublié l'encadrement des titres des catégories!
Dans le template déjà modifié, cherchez:
Cordialement.
Exact, j'ai oublié l'encadrement des titres des catégories!
Dans le template déjà modifié, cherchez:
- Code:
<td colspan="{catrow.tablehead.INC_SPAN}" nowrap="nowrap" width="100%" class="secondarytitle"> {catrow.tablehead.L_FORUM} </td>
- Code:
<td colspan="{catrow.tablehead.INC_SPAN}" nowrap="nowrap" width="100%"><div class="secondarytitle"> {catrow.tablehead.L_FORUM}</div> </td>
- Code:
/*titre des categories*/
.secondarytitle{
-moz-border-radius-topleft: 20px;
-moz-border-radius-topright: 20px;
-webkit-border-top-right-radius: 20px;
-webkit-border-top-left-radius: 20px;
border-top-right-radius: 20px;
border-top-left-radius: 20px;
border-bottom: 0 none !important;
border-left: 3px solid #000000;
border-right: 3px solid #000000;
border-top: 3px solid #000000;
color: #000000;
font-size: 11px;
font-style: italic;
height: 14px;
padding: 3px;
position: relative;
text-align: center;
width: 350px;
margin:auto;}
/*cadre des categories*/
.forumline{
color: #000000;
border: 5px solid #000000;
-moz-border-radius: 14px;
-webkit-border-radius: 14px;
border-radius: 14px;}
Cordialement.
Invité- Invité
Re: Modifier l'apparence des catégories et des forums
C'est parfait, merci beaucoup ^^
Cordialement, Saranna.
Cordialement, Saranna.
Re: Modifier l'apparence des catégories et des forums
Bonjour,
Si votre problème est résolu, n'oubliez pas d'éditer votre premier message et de cocher .
Si vous avez d'autres questions, n'hésitez pas non plus!
Cordialement.
Si votre problème est résolu, n'oubliez pas d'éditer votre premier message et de cocher .
Si vous avez d'autres questions, n'hésitez pas non plus!
Cordialement.
Invité- Invité
Re: Modifier l'apparence des catégories et des forums
Bonjour,
L'affaire est terminée, je classe.
Merci beaucoup pour l'aide.
L'affaire est terminée, je classe.
Merci beaucoup pour l'aide.
Sujets similaires
» Modifier les catégories dans les forums.
» Modifier la police des titres de catégories/forums
» Modifier la hauteur de la barre des forums et des catégories ?
» modifier les icones des "Catégories,forums, sections"
» Modifier la séparation des sous-forums sur les catégories
» Modifier la police des titres de catégories/forums
» Modifier la hauteur de la barre des forums et des catégories ?
» modifier les icones des "Catégories,forums, sections"
» Modifier la séparation des sous-forums sur les catégories
Forum gratuit : Le forum des forums actifs :: Entraide & Support... :: Problème avec un script, un code :: Archives des problèmes avec un code
Page 1 sur 1
Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum