Commande de Ormée ♠ Catégorie pour Numendor RPG

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

Messages : 40
Age du personnage : 18
Date d'inscription : 03/01/2010

Feuille de personnage
Ton Carnet:

Parchemin signé Ocelline le Lun 25 Nov - 18:55


Alors avant de vous donner les codes :

Dans votre PA faite Affichage -> Page d'accueil -> Structure et Hiéarchie et sélectionnez Séparer les Catégories sur l'Index -< Moyen puis validez.

Ensuite dans Images & Couleurs sélectionnez l'onglet couleur et supprimer les couleurs des tables des catégories soit Table Rangée Couleur 1 ,Table Rangée Couleur 2 et surbrillance , Table Rangée Couleur 3 et séparations

Et c'est partie pour les codes Wink

Collez-ce template index-box :
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"> {catrow.tablehead.L_FORUM} </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">
 
</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}>
                  <div class="box"><span class="genmed"><div class="nonew"><img title="{catrow.forumrow.L_FORUM_FOLDER_ALT}" src="{catrow.forumrow.FORUM_FOLDER_IMG}" alt="{catrow.forumrow.L_FORUM_FOLDER_ALT}" /></div>{catrow.forumrow.FORUM_DESC}<div class="lastpost">{catrow.forumrow.LAST_POST}</div><div class="stat">
 {catrow.forumrow.TOPICS} Messages


               {catrow.forumrow.POSTS} Sujets - Texte changeable</div></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 -->
 <div class="sous_forum">
    <span class="sforum">{catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}</span>
    <span class="ouverture_sousforum">Voir les sous-forum</span>
  </div>
 </span>
 



           

<!-- 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 -->
Voici le css à coller :
Code:
/*Catégories*/

.namefow{
  font-size:25px;
  text-transform:uppercase;
  color:white;
font-family: 'Unica One', cursive;
  text-align:center;
position:absolute;
margin-left:420px;
  margin-top:-8px;
  z-index:4

}

a:hover{
  text-decoration:none!important ;
}

.box{
 background-color:black;
  width:850px;
  height:220px;
margin-top:-15px;
  border:1px solid white;
  border-radius:50px 50px 50px 50px;
  margin-left:85px;
  padding-bottom:-215px;
  
  
}

.cate{
 
background:url('') top center no-repeat;
  width:550px;
  height:auto;
  margin-left:55px;
  margin-top:auto;
  margin-bottom:-10px;
 

}

.nonew{
 margin-top:40px;
  margin-left:20px;}

.descrimg{
  width:450px;
  height:100px;
  margin-left:150px;
  position:relative;
  margin-top:-95px;
  position:relative;
  z-index:2;
  overflow:hidden;
padding-bottom:65px;
}

.descrimg:hover{
  width:450px;
  height:100px;
  margin-left:140px;
  position:relative;
  margin-top:-95px;
  position:relative;
  opacity:0.1;
-webkit-transition: opacity 1s ease-in-out;/*chrome*/
-moz-transition: opacity 1s ease-in-out;/*mozilla*/
  transition: opacity 1s ease-in-out;/*autre navigateur*/
  color:white;

 

}

.stat{

  color:white;
  margin-left:300px;
  text-transform:uppercase;
  font-family: 'Unica One', cursive;
  font-size:12px;
  margin-top:10px;

}

.sforum
{
  position: relative;
  z-index: 3;
  display: block;
  height:0;
  width:693px;
    background:black;
  color: #b5b5b5;
  overflow: hidden;
    transform: all;
-moz-transform: all;
-o-transform: all;
-htm-transform: all;
-webkit-transform: all;
transition: 1s;
-moz-transition: 1s;
-o-transition: 1s;
-htm-transition: 1s;
-webkit-transition: 1s;
  border-radius:10px 10px 0px 0px;
  margin-left:132px;
  margin-top:1px;
margin-bottom:-1px;
}

.ouverture_sousforum
{
  position: relative;
  z-index: 2;
  display: block;
  float: right;
  width:700px;
  margin-right:105px;
  background:black;
  color: #b5b5b5;
  font-size: 11px;
  text-align: center;
  padding:-4px;
  -webkit-border-bottom-right-radius: 10px;
-webkit-border-bottom-left-radius: 10px;
-moz-border-radius-bottomright: 10px;
-moz-border-radius-bottomleft: 10px;
border-bottom-right-radius: 10px;
border-bottom-left-radius: 10px;
 

}

.sous_forum:hover .sforum
{
  height:20px;
  background:black;
  color: #b5b5b5;
  padding: 4px;
  overflow: auto;
    transform: all;
-moz-transform: all;
-o-transform: all;
-htm-transform: all;
-webkit-transform: all;
transition: 1s;
-moz-transition: 1s;
-o-transition: 1s;
-htm-transition: 1s;
-webkit-transition: 1s;
margin-bottom:-5px;
}

.lastpost{
  width:100px;
  height:100px;
  margin-left:700px;
  color:white;
  font-size:12px;
  text-decoration:none!important;
  margin-top:-125px;
  background-color:#31613F;
  width:100px;
  text-indent:5px;
  padding-left:5px;

}
  
        .nav img {
        width:500px!important;}
Dans les titres de catégorie :
Code:
<div style="margin-top:15px;"><div class="cate"><img src="ADRESSE_DE_L'IMAGE"> </div> </div>
Les titres de forum :
Code:
<link href='http://fonts.googleapis.com/css?family=Unica+One' rel='stylesheet' type='text/css'><div class="namefow"> Titre du forum </div>
Le code à mettre dans les descriptions :
Code:
<div class="descrimg"><img src="http://www.athair.com/wp-content/uploads/2010/12/deathwing.jpg"></div> <div style="color:white;z-index:4;width:450px;height:110px;margin-top:-159px;margin-left:150px">  L'amour est le seul poison qui peut venir à bout de mon coeur. Je te le révèle aujourd'hui car je sais que tu m'aimes et que tu ne me précipiteras pas de l'autre côté du monde. En tout cas ce n'est n'y aujourd'hui n'y demain. Lorem LupsumL'amour est le seul poison qui peut venir à bout de mon coeur. Je te le révèle aujourd'hui car je sais que tu m'aimes et que tu ne me précipiteras pas de l'autre côté du monde. En tout cas ce n'est n'y aujourd'hui n'y demain. Lorem Lupsum</div>
Revenir en haut Aller en bas
Voir le profil de l'utilisateur

Commande de Ormée ♠ Catégorie pour Numendor RPG

Voir le sujet précédent Voir le sujet suivant Revenir en haut
Page 1 sur 1

Sujets similaires

-
» Police catégorie et Code html
» Code CSS catégorie design
» Un icone différent pour chaque catégorie
» Mettre une image pour une catégorie
» Code pour mettre une image en fond de titre de catégorie.

Forum de test de Ocelline :: 
 :: Commandes de codage
-