Astuce: Affichage des forums avec onglets

[Shadow]

Rappel du premier message :

Affichage des forums avec onglets

Beaucoup d'entre vous demandent comment réaliser cet effet : Ce tutoriel tâchera de vous l'expliquer. Évitez les modifications de templates si vous n'avez pas les connaissances minimales requises... Avant toute chose, vous devez : - être fondateur du forum, - être en version phpBB2, - avoir un minimum de connaissances en HTML, & templates. Ajout dans le CSS Panneau d'administration Affichage Couleurs Feuille de style CSS Insérez ce code dans votre feuille de style CSS : Code: /*--- Cette partie correspond à la description du forum ---*/ .forum-description {       margin: auto;       padding: 10px;       color: #000000;       width: 80%;       border: 3px solid #000000;       -moz-border-radius: 14px;       -webkit-border-radius: 14px;       font-size: 12px; } /*--- Cette partie correspond à l'onglet "X messages dans X sujets" ---*/ .forum-stats {       -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;       left: 280px;       padding: 3px;       position: relative;       text-align: center;       width: 200px; } /*--- Cette partie correspond à l'affichage des sous-forums ---*/ .forum-sousforum {       color: #000000;       border: 3px solid #000000;       border-top: 0px !important;       -moz-border-radius-bottomleft: 14px;       -moz-border-radius-bottomright: 14px;       -webkit-border-bottom-right-radius: 14px;       -webkit-border-bottom-left-radius: 14px;       border-bottom-right-radius: 14px;       border-bottom-left-radius: 14px;       margin: auto;       padding: 4px;       color: #000000;       width: 50%;       text-align: center;       height: 14px;       font-size: 11px; } Modifications des templates Panneau d'administration Affichage Templates Général Editez le template index_box Remplacez l'intégralité du template par : Code: <table width="100%" border="0" cellspacing="1" cellpadding="0" align="center">    <tr>       <td valign="bottom">          <!-- BEGIN switch_user_logged_in -->          <span class="gensmall">{LAST_VISIT_DATE}<br />          {CURRENT_TIME}<br />          </span>          <!-- END switch_user_logged_in -->          <div class="nav"><a class="nav" href="{U_INDEX}">{L_INDEX}</a>{NAV_CAT_DESC}</div>       </td>       <td class="gensmall" align="right" valign="bottom">          <!-- BEGIN switch_user_logged_in -->          <a class="gensmall" href="{U_SEARCH_NEW}">{L_SEARCH_NEW}</a><br />          <a class="gensmall" href="{U_SEARCH_SELF}">{L_SEARCH_SELF}</a><br />          <!-- END switch_user_logged_in -->          <a class="gensmall" href="{U_SEARCH_UNANSWERED}">{L_SEARCH_UNANSWERED}</a>       </td>    </tr> </table> <!-- 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">&nbsp;{catrow.tablehead.L_FORUM}&nbsp;</th>       <th nowrap="nowrap" width="150"><div style="width:150px;">{L_LASTPOST}</div></th>    </tr>    <!-- END tablehead -->    <!-- BEGIN cathead -->    <tr>       <!-- BEGIN inc -->       <td class="{catrow.cathead.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" /></td>       <!-- END inc -->       <td class="{catrow.cathead.CLASS_CAT}" colspan="{catrow.cathead.INC_SPAN}" width="100%">          <h{catrow.cathead.LEVEL} class="hierarchy">             <span class="cattitle">                <a class="cattitle" title="{catrow.cathead.CAT_DESC}" href="{catrow.cathead.U_VIEWCAT}">{catrow.cathead.CAT_TITLE}</a>             </span>          </h{catrow.cathead.LEVEL}>       </td>       <td class="{catrow.cathead.CLASS_ROWPIC}" colspan="3" align="right">&nbsp;</td>    </tr>    <!-- END cathead -->    <!-- BEGIN forumrow -->    <tr>       <!-- BEGIN inc -->       <td class="{catrow.forumrow.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" alt="." /></td>       <!-- END inc -->       <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><br />             </span>          </h{catrow.forumrow.LEVEL}> <!---- DÉBUT DES MODIFICATIONS EFFECTUEES PAR LE FORUM DES FORUMS ---->       <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>       <!-- BEGIN forum_link_no -->       <td class="row3 over" align="center" valign="middle" height="50">          <span class="gensmall">{catrow.forumrow.LAST_POST}</span>       </td> <!---- FIN DES MODIFICATIONS EFFECTUEES PAR LE FORUM DES FORUMS ---->       <!-- END forum_link_no -->       <!-- BEGIN forum_link -->       <td class="row3" colspan="3" align="center" valign="middle" height="50"><span class="gensmall">{catrow.forumrow.forum_link.HIT_COUNT}</span></td>       <!-- END forum_link -->    </tr>    <!-- END forumrow -->    <!-- BEGIN catfoot -->    <tr>       <!-- BEGIN inc -->       <td class="{catrow.catfoot.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" /></td>       <!-- END inc -->       <td class="spaceRow" colspan="{catrow.catfoot.INC_SPAN}" height="1"><img src="{SPACER}" alt="" height="1" width="1" /></td>    </tr>    <!-- END catfoot -->    <!-- BEGIN tablefoot --> </table><img src="{SPACER}" alt="" height="5" width="1" /><!-- END tablefoot --><!-- END catrow --> Attention : si vous aviez effectué d'autres modifications sur ce template, elles seront perdues. Auquel cas je vous conseille plutôt d'essayer de combiner les deux codes : le vôtre et celui-ci. Vérifiez en cliquant sur En attente Et si vous êtes satisfait du résultat, publiez

Ce tutoriel a été rédigé par le Staff du Forum des Forums, Et en particulier par Toto456. Aucune reproduction possible sans notre accord, conformément à l’article L122-1 du CPI.

[.::CIAO::.]

J'ai un petit problème (j'ai quand même copier l'ancien template^^)moi sa fait sa regarder :

Spoiler:

voilà le lien du forum si vous voulez voir

http://story-of-naruto.forumactif.com/forum.htm

[Threax]

Les questions et problèmes relatifs à ce tutoriel ne sont pas à poster dans les Annonces.

Merci d'ouvrir un sujet dans l'Entraide.