Apparence des sous forum en "étiquettes".

Voir le sujet précédent Voir le sujet suivant Aller en bas

Résolu Apparence des sous forum en "étiquettes".

Message par Censure le Mar 3 Jan 2012 - 20:24

Bonsoir, depuis quelques jours j’essaye de modifier l'aspect des "barre de catégories" les (.th?), mais je n'y parvient pas.
Enfaite j'aimerais que les titres des catégories soit inscrits dans des sortent d’étiquettes, et qu'il n'y est plus cette grande barre, que l'aspect de la barre soit comme celle du menus "Derniers Messages", mais en gardant la taille des sous forum.
Se plus j'aimerais que les images "Nouveaux messages/Pas de nouveaux messages"
soient mises dans la parties "Derniers messages"
Sur l'image:
En rouge ce qui est à supprimer
Le titre de la catégories en étiquettes.
En violet: déplacer l'image "nouveau messages/pas de nouveaux messages..." dans la partie derniers messages.
En vert, le résultats final.

J'ai fait plusieurs tentative dans le template index_box, mais j'ai plus réussi à déformer le forum qu'autres choses.
Il faut sans doutes passer par un tableau, mais je préfère demander de l'aide que faire une bêtises.

Ci-dessous le template Index_box avec quelques modifications.

Code:
      <table width="100%" border="0" cellspacing="1" cellpadding="0" align="center">
   <tr>
      <td valign="bottom">
         <!-- BEGIN switch_user_logged_in -->
                  <span class="gensmall"><font color="white"><center>{LAST_VISIT_DATE}</font> <font color="green">| </font>
                    <font color="white">{CURRENT_TIME}</center></font><br />
         </span>
         <!-- END switch_user_logged_in -->
                 
                  <div class="nav"><a class="nav" href="{U_INDEX}"><center><font color="red">~ </font><blink><font color="white">Retour à l'accueil</font></blink><font color="red"> ~</font></center></a>{NAV_CAT_DESC}</div>
                         
      
         <!-- BEGIN switch_user_logged_in -->
                  <center>
                  <a class="gensmall" href="{U_SEARCH_NEW}">{L_SEARCH_NEW}</a> <font color="green">| </font>
         <a class="gensmall" href="{U_SEARCH_SELF}">{L_SEARCH_SELF}</a> <font color="green">| </font>
         <!-- END switch_user_logged_in -->
         <a class="gensmall" href="{U_SEARCH_UNANSWERED}">{L_SEARCH_UNANSWERED}</a> <font color="green">| </font>
                  </center>
      </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"> {catrow.tablehead.L_FORUM} </th>
          <th nowrap="nowrap" width="150"><div style="width:150px;"><center>{L_LASTPOST}</center></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"> </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">
                 <table width="100%"><tbody><tr><td><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}></td><td style="padding-left: 40px; text-align: right;" class="gensmall"><div class="forum-stats">{catrow.forumrow.POSTS} <font color="green">Messages</font> <font color="black">|</font> {catrow.forumrow.TOPICS} Sujets</td></tr></tbody></div></table>
                  <span class="genmed">
                <div class="forum-description">
        <span class="genmed">{catrow.forumrow.FORUM_DESC}</span>
</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 -->
            {catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}
         </span>
      </td>
      <td class="row3 over" align="center" valign="middle" height="50">
         <span class="gensmall">{catrow.forumrow.LAST_POST}</span>
      </td>
   </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 -->

Le CSS
Code:

  th{
          text-align:left;
          background-image:url('http://i47.servimg.com/u/f47/14/37/99/28/sans_t13.png');
          background-repeat:no-repeat;}
       
        #fa_ticker_block{
          width: 100%;}
       
        div#fa_ticker_container {
          background-image:url('http://i47.servimg.com/u/f47/14/37/99/28/annonc15.png');
          background-repeat:no-repeat;}
       
        #fa_ticker_block td{
          background: none !important;
          border:10px #000000;}
       
        #fa_ticker_block table{
          background: none !important;
          border:10px #000000;}
       
        td.row3 {
          border-left:0.7px solid #DCDCDC;
          border-bottom:1px solid #DCDCDC;
          background-opacity: 20%;
          border-bottom:1px solid #DCDCDC;
          -moz-border-radius:5px;
          -webkit-border-radius:5px;}
       
        .forum-stats{
          text-shadow:2px 2px 2px #96CA2D;
          font-family:georgia;
          text-transform:capitalize;
          text-align:left;
          font-size:100%;
          color:#ffffff;
          letter-spacing:1px;
          margin-left:-184px;
          margin-top:-12px;
          padding:2px;
          display:block;
          width:130px;
          height:25px;
          -moz-border-radius:5px;
          webkit-border-radius:5px;
          background-color:#B4AF91;
          border:0.7px solid #EFECCA;}
       
        a.forumlink:link,a.forumlink:visited {
          text-shadow:2px 2px 2px #333333;
          font-family:georgia;
          text-align:left;
          padding-top:5px;
          padding-left:6px;
          font-size:100%;
          border-bottom:0px solid #A7A37E;
          color:#fff;
          text-transform:capitalize;
          letter-spacing:1px;
          display:block;
          -moz-border-radius:5px;
          webkit-border-radius:5px;
          background-color:#A7A37E;
          width:580px;
          text-decoration: none;
          margin-top:-4px;
          margin-bottom:-3px;
          border-bottom:1px solid #DCDCDC;}
       
        /*--- Cette partie correspond à la description du forum ---*/
        .forum-description {
          font-size:12px;
          height:auto;
          overflow-y: auto;
          width:567px;
          padding:7px;}
       
        /*--- Cette partie correspond au QEEL---*/
        .LEGEND{
          font-family:georgia;
          text-align:center;
          font-size:100%;
          color:#fff;
          letter-spacing:1px;
          display:block;
          width:auto;
          padding:5px;
          margin:2px;}
       
        /*--- Cette partie correspond à la partie droite du QEEL---*/
        .gauche{
          text-align:right;
          border-right:1px solid #fff;
          padding:5px;
          margin:2px;}
       
        /*--- Cette partie correspond à la partie gauche du QEEL---*/
        .droite{
          text-align:left;}
       
        /*--- Puce-----*/
        li {
          font-family: Arial, sans-serif;
          font-size: 100%;
          color: #96CA2D;
          display : list-item;}

        /*--- Cette partie correspond à la partie des catégories---*/       
        .contour{
        font-family:georgia;
          border-bottom: 5px solid #A7A37E;
          overflow-y:scroll;
          text-align:left;
          margin-top:5px;
          padding-top:5px;
          padding-left:6px;
          margin-top:-10px;
          font-size:100%;
          border-bottom:5px solid #B4AF91;
          border:0.7px solid #B4AF91;
          color:#fff;
          text-transform:capitalize;
          letter-spacing:1px;
          display:block;
          -moz-border-radius:5px;
          webkit-border-radius:5px;
          background-color:#A7A37E;
          width:540px;
          height:65px;
          text-shadow:2px 2px 2px #000000;}
       
        a.forumlink:hover{
          letter-spacing:1px;
          color:#fff;
          font-style:italic;
          text-decoration: none;}
             
     
Merci de votre aide, Censure.


Dernière édition par Censure le Ven 6 Jan 2012 - 13:35, édité 5 fois

Censure
****

Masculin
Messages : 218
Inscrit(e) le : 21/12/2010

http://guilde-exode.bbactif.com/
Censure a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Apparence des sous forum en "étiquettes".

Message par Final-Blonde le Mer 4 Jan 2012 - 15:05

Bonjour,

Apparemment ce serait faisable...
Néanmoins juste une question : Collée à la bordure du forum, ou bien décollée (flottante) ?

Final-Blonde
# Tropactif #

Féminin
Messages : 1581
Inscrit(e) le : 09/05/2010

http://www.siteduzero.com/
Final-Blonde a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Apparence des sous forum en "étiquettes".

Message par Censure le Mer 4 Jan 2012 - 17:43

Collée pour que ça reste en harmonie avec le reste du forum.
Merci de votre aide Smile
J'ai éditée mon premier messages si vous voulez plus d'info.

Censure
****

Masculin
Messages : 218
Inscrit(e) le : 21/12/2010

http://guilde-exode.bbactif.com/
Censure a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Apparence des sous forum en "étiquettes".

Message par Censure le Jeu 5 Jan 2012 - 17:44

Encore une fois, j'ai essayer de mon coter, mais sans résultats. De l'aide serais le bien venu.

Censure
****

Masculin
Messages : 218
Inscrit(e) le : 21/12/2010

http://guilde-exode.bbactif.com/
Censure a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Apparence des sous forum en "étiquettes".

Message par Final-Blonde le Jeu 5 Jan 2012 - 22:45

Bonsoir Censure,

Tout d'abord, la coloration des templates permet aussi d'éviter les erreurs de structure comme des balises mal fermées... Donc quand il y a du rouge (sauf si c'est dans le template de base ainsi), il faut chercher à corriger.

Ensuite, évite les balises "center" quand on peut aligner par des balises "td" (là on peut même aligner verticalement) ou "div".

J'ai remis tout au vert, et peut-être que tu devras espacer tes symboles avec le code HTML de l'espacement latéral &*nbsp; (sans l'étoile).

Donc voici le template index_box avec, je le souhaite, ce que tu demandes :
Code:
<table width="100%" border="0" cellspacing="1" cellpadding="0" align="center">
<tr>
<td align="center" valign="bottom">
 
<!-- BEGIN switch_user_logged_in -->
<span class="gensmall"><font color="white">{LAST_VISIT_DATE}</font> <font color="green"> | </font>
<font color="white">{CURRENT_TIME}</font></span>
<br />
<!-- END switch_user_logged_in -->

<div class="nav" align="center">
<a class="nav" href="{U_INDEX}"><font color="red">~ </font><blink><font color="white">Retour à l'accueil</font></blink><font color="red"> ~</font>{NAV_CAT_DESC}</a>
</div>

<!-- BEGIN switch_user_logged_in -->
<a class="gensmall" href="{U_SEARCH_NEW}">{L_SEARCH_NEW}</a><font color="green"> | </font>
<a class="gensmall" href="{U_SEARCH_SELF}">{L_SEARCH_SELF}</a><font color="green"> | </font>
<!-- END switch_user_logged_in -->
<a class="gensmall" href="{U_SEARCH_UNANSWERED}">{L_SEARCH_UNANSWERED}</a><font color="green"> | </font>
</td>
</tr>
</table>
<!-- BEGIN catrow --><!-- BEGIN tablehead -->
<table width="100%" border="0" cellspacing="1" cellpadding="0"><tr>
 
<td> 
<table width="150" class="forumline" align="left"><tr>
<th colspan="{catrow.tablehead.INC_SPAN}" nowrap="nowrap" class="secondarytitle">
<div align="center" style="width:150px;">{catrow.tablehead.L_FORUM}</div></th>
</tr></table>
</td>
<td> 
<table width="150" align="right"><tr>
<td nowrap="nowrap" width="150"><div style="width:150px;"></div></td>
</tr></table>
</td>
 
</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}">
<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"> </td>
</tr>
<!-- END cathead -->
<!-- BEGIN forumrow -->
<tr>

<td class="row1 over" colspan="{catrow.forumrow.INC_SPAN}" valign="top" width="100%" height="50">

<table width="100%"><tr><td>
<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}></td>
<td style="padding-left: 40px; text-align: right;" class="gensmall">
<div class="forum-stats">{catrow.forumrow.POSTS} <font color="green">Messages</font> <font color="black">|</font> {catrow.forumrow.TOPICS} Sujets</div>
</td></tr></table>
<div class="forum-description"><span class="genmed">{catrow.forumrow.FORUM_DESC}</span></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 -->
{catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}</span>
</td>
 
<td>
<table><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="row3 over" align="center" valign="middle" height="50" width="150">
<span class="gensmall">{catrow.forumrow.LAST_POST}</span>
 
</td></tr></table>

</td>
</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 -->

Final-Blonde
# Tropactif #

Féminin
Messages : 1581
Inscrit(e) le : 09/05/2010

http://www.siteduzero.com/
Final-Blonde a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Apparence des sous forum en "étiquettes".

Message par Censure le Ven 6 Jan 2012 - 13:05

Oui le résultats me convient, je n’ai plus qu'a personnaliser le look.
Merci de votre aide, et merci de vous être pencher sur mon problèmes.

Censure
****

Masculin
Messages : 218
Inscrit(e) le : 21/12/2010

http://guilde-exode.bbactif.com/
Censure a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut


Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum