Codes Forums

36 à 177

Code:

<img src="http://img11.hostingpics.net/pics/8350530ZImeXe.png" style="width: 780px;"/>
<div class="fond_qeel">
      <div class="groupe1">
<center><span class="groupe"> <a href="http://stamanssoult.forumactif.com/g2-staff"><font color=#689A35><b>Staff</b></font></a></span></br>
                <span class="groupe"> <a href="http://stamanssoult.forumactif.com/g3-syndrigastis-nomades"><font color=#E6A327><b>Syndrigastis nomades </b></font></a></span></br>
                <span class="groupe"> <a href="http://stamanssoult.forumactif.com/g4-ombrunes"><font color=#CC6308><b>Ombrunes </b></font></a></span></br>
  <span class="groupe"> <a href="http://stamanssoult.forumactif.com/g7-estres"><font color=#AD1A1A><b>Estres</b></font></a></span></br>
  <span class="groupe"> <a href="http://stamanssoult.forumactif.com/g5-boucle-de-kinsale"><font color=#A81C5E><b>Boucle de Kinsale</b></font></a></span></br>
        <span class="groupe"> <a href="http://stamanssoult.forumactif.com/g6-boucle-de-st-amans"><font color=#543425><b>Boucle de St Amans</b></font></a></span>
        </center>
    </div>
<table border="0" width="100%">
<tr>
<td align="center" rowspan="3">
<img src="http://img11.hostingpics.net/pics/586986qeel2.png" style="width: 230px; height: 210px;"/>
</td>
<td align="center">
<div class="bloc_stat1">
<span class="gensmall">{TOTAL_POSTS}<br />
      {TOTAL_USERS}<br />
      {NEWEST_USER}</span>
      <table><span class="gensmall"> {L_WHOSBIRTHDAY_TODAY} <br /> {TOTAL_CHATTERS_ONLINE}</span></table>
</div>
</td>

<td align="center">
<div class="bloc_stat1">
  <span class="gensmall">{TOTAL_USERS_ONLINE}<br />{LOGGED_IN_USER_LIST}</span>
</div>
</td>
</tr>

    <tr>
<td align="center" colspan="2">
<div class="bloc_stat2">
<table><span class="gensmall">{L_CONNECTED_MEMBERS}</span></table>
</div>
</td>
</tr>
</table>
</div>
  <img src="http://i.imgur.com/7Niv9e9.png" style="width: 780px;"/>

Tuto de base : http://www.pub-rpg-design.com/t99334-qeel-1-phantasmagoria

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>
 
 <!-- **** Début des modifications effectuées par
                ****** Phantasmagoria*** -->

<!-- BEGIN catrow -->
  <!-- BEGIN tablehead -->

 <table class="modifcat" width="100%" border="0" cellspacing="0" cellpadding="0">
<div style="background-image : url(http://image.noelshack.com/fichiers/2016/26/1467047828-hautcat.png) ; background-repeat : no-repeat ; width : 750px ; height : 120px; margin-bottom: -2px;"><div class="catégoz" align="center">{catrow.tablehead.L_FORUM}</div>
   <!-- END tablehead -->
   <!-- BEGIN cathead -->
   <tr>
          <!-- END cathead -->
      <!-- BEGIN forumrow -->
       <!-- BEGIN inc -->
            <td class="{catrow.forumrow.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" alt="." /></td>
            <!-- END inc -->

            <td align="left" valign="top">
              
                
              <table width="100%" cellpadding="0" cellspacing="0"><br />

                
          <tr>

          
                          <td align="center" valign="top">    <div style="margin-left: 7px;"><div class="sousfofo">
                                            <div><span id="subforums">  {catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}</span></div>
<script type="text/javascript">
  jQuery('#subforums').html(jQuery('#subforums').html().replace(/, /g,' <br />')).removeAttr('id');
                            </script></div></div> </td>
                                                
                            <td valign="top"><div style="margin-top: 17px; margin-left:4px;"><div class="statdescrip"> <table width="100"><tr><td width="70%"><div style="margin-top: -20px";><div class="forumtitre">
                              <a href="{catrow.forumrow.U_VIEWFORUM}"><center>{catrow.forumrow.FORUM_NAME}</center></a></div></div>
                                <span class="genmed"><div class="stat1">
                                    Sujets {catrow.forumrow.TOPICS} | Messages {catrow.forumrow.POSTS}</div></span>
                              <div class="descrip_bloc1">
                                {catrow.forumrow.FORUM_DESC}</td><td <width="30%"></div>
                            </td></tr></table>
                                      
                              </div></div>
                          </td>
                              <td><div style="width: 10px;" align="top"></div>
                            <!-- BEGIN avatar --> <div style="margin-left: -15px;"><span class="lastpost-avatar">{catrow.forumrow.avatar.LAST_POST_AVATAR}</span>
                            <!-- END avatar --></div>  </td><td valign="top">
          
                </td>
                              <td valign="top"><div style="margin-top: 9px;"><div class="statistiques_cat">
                                    <span class="genmed"><div  class="forumdesc1">
                                      {catrow.forumrow.LAST_POST}  </div></span> <div class="image_cate">
                              <img title="{catrow.forumrow.L_FORUM_FOLDER_ALT}" src="{catrow.forumrow.FORUM_FOLDER_IMG}" alt="{catrow.forumrow.L_FORUM_FOLDER_ALT}" />  
                              </div>
                                </div>    </td>
                              


                                      
                    
            </tr>
                  
</table>
</td></tr>

        <!-- *******Fin des modifications par Magma. ******
                    ********* Toute reproduction complète
                    ******* ou partielle est prohibée ****** -->
                <!-- 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" /><img src="http://image.noelshack.com/fichiers/2016/28/1468408136-bascat.png" style="margin-top: -5px; width:750px; height: 50px;"/><!-- END tablefoot --><!-- END catrow -->

Tuto de base : http://www.pub-rpg-design.com/t116801-categories-6-magma

Supprimer ça dans Affichage/Templates/Général/index_body

Code:

<table border="0" cellspacing="3" cellpadding="0" align="center">
  <tr>
      <td align="center" width="20"><img src="{FORUM_NEW_IMG}" alt="{L_NEW_POSTS}" /></td>
      <td><span class="gensmall">{L_NEW_POSTS}</span></td>
      <td></td>
      <td align="center" width="20"><img src="{FORUM_IMG}" alt="{L_NO_NEW_POSTS}" /></td>
      <td><span class="gensmall">{L_NO_NEW_POSTS}</span></td>
      <td>  </td>
      <td align="center" width="20"><img src="{FORUM_LOCKED_IMG}" alt="{L_FORUM_LOCKED}" /></td>
      <td><span class="gensmall">{L_FORUM_LOCKED}</span></td>
  </tr>
</table>

Tuto de base : http://forum.forumactif.com/t312629-supprimer-les-images-nouveaux-messages-etc-d-en-bas-du-forum

Code:

a:hover { /* Définition de la déco des liens quand on les survole */
color: #F8BE64; /* choix d'une couleur lien de survol*/
letter-spacing:4px; /* ça, c'est l'espacement entre les lettres */
font-family:"Arial"; /* choix d'une police */
font-variant:small-caps; /* On affiche le texte en petites majuscules */
font-size:100%;            /* taille de la police en % de la taille normale */
border-bottom-width: 0px;  /* Soulignement du lien survolé (taille) */
border-bottom-style:; /* Soulignement du lien survolé (style) */
border-bottom-color: #C0AE85;  /* Soulignement du lien survolé (couleur) */
}

     
       
.bodyline{ /* Bordure du forum */
      border: 0px #101010 solid;
  box-shadow: #000000 0 0 10px;
  }

.bloc{
background-color: #F0E4D6;
}

.titrespa {
  background-color: #332620;    /* couleur de fond */
  background-image: url(https://i62.servimg.com/u/f62/11/27/17/22/fond_t10.png);
  border:1px dotted #;      /* bordure haut et bas : taille, style, couleur */
  border-left:1px dotted #  /* bordure gauche : taille, style, couleur */
  border-right:1px dotted #; /* bordure droite : taille, style, couleur */
  color: #F8CD7E;              /* couleur du texte */
  font-weight:normal;        /* texte en gras par défaut */
  letter-spacing:6px;      /* espacement des lettres */
  font-variant : small-caps;  /* texte en petites majuscules */
  font-size:100%;            /* taille de la police en % de la taille normale */
  text-align:center;        /* alignement du texte */
  font-family : Verdana;  /* police d'écriture */
margin-bottom:10px;
}


td.row3{
  background-image: url();
  }

td.row2{
  background-image: url();
  }

td.row1{
  background-image: url();
  }

.topic{
  background-image: url();
  }


a{
  outline: none;
  font-variant: small-caps;
  }

th {
  font-family:monospace; (police)
  text-align: center; (pour aligner le texte)
  }

.spoiler_content {
  display: block;
  }

.hidden .spoiler_content {
  display: none;
  }


A:link {text-decoration: none !important;}
A:visited {text-decoration: none !important;}
A:active {text-decoration: none !important;}
A:hover {text-decoration: none !important;}


a.forumlink { /* Ombre Titre de Forums */
text-shadow: #C0C0C0 1px 1px 1px;
}


.postdetails.poster-profile a img {
  -moz-border-radius-bottomleft: 10px;
  -moz-border-radius-bottomright:10px;
  -moz-border-radius-topleft:10px;
  -moz-border-radius-topright:10px;
  border: 8px solid #D4C0AB;
  }

a.forumlink{ /* Titres & Soulignement Forums */
border-bottom: 3px double #967C66;
  font-size: 16px;
  font-family: "Verdana";
color:#000000;
display:block;
text-align: center;
}

#navitop {position: relative;top: 0px;}

#mini { border: 1px solid #9DC9B5;padding: 3px; background-image: url(https://i62.servimg.com/u/f62/11/27/17/22/fond_t10.png)} /* Bordure images PV PA (normal) */
#mini:hover { border: 1px solid #E4F8F1; padding: 3px; background-color:#080807}  /* Bordure images PV PA (survolé) */

    a.tooltip em { /* Infos bulle PA */
        display:none;
    }
    a.tooltip:hover { /* Infos bulle PA */
        border: 0;
        position: relative;
        z-index: 999;
        text-decoration:none;
    }
    a.tooltip:hover em {  /* Infos bulle PA */
        font-style: normal;
        display: block;
        position: absolute;
        top: 0px;
        left: 0px;
        padding: 4px;
        color: #F8F1DE;
        border: 1px solid 0A0A0A;
  background-image: url(https://i62.servimg.com/u/f62/11/27/17/22/fond_t10.png);
        background: 0A0A0A;
        width:120px;-moz-border-radius:0px;
    }
   


.connectés {
-moz-border-radius : 5px 5px 5px 5px;/*pour arrondir les bords*/
font-size : 15px ; /*grandeur du texte*/
background-color: #1E784D;
background-image: url(http://i27.servimg.com/u/f27/13/87/04/32/sans_t19.png);
padding-left : 25px ;
padding-right: 25px;
padding-top: -5px;
padding-bottom: 5px;}

.paonglet
        {
        display:inline-block;
        margin-left:20px;
        margin-right:20px;
        padding:10px;
        cursor:pointer;
        background-color: #8A8A8A;
        color: #fff;
        }
.paonglet_0
        {
        border-radius: 2px 2px 2px 2px;
        -moz-border-radius: 2px 2px 2px 2px;
        -webkit-border-radius: 2px 2px 2px 2px;
        }
        .paonglet_1
        {
          color: #2A2A2A;
          border-radius: 2px 2px 2px 2px;
          -moz-border-radius: 2px 2px 2px 2px;
          -webkit-border-radius: 2px 2px 2px 2px;
        }

        .contenu_paonglet
        {
                margin-top:-1px;
                padding: 2px;
                display:none;
                height: 320px;
        }





/*ESPACES TITRE CATEGORIE-FORUM*/
.forumlink{
margin-left: 35px;
margin-right: 15px
}

.partiegauche {
-moz-border-radius :  50px 50px 50px 50px; /*pour arrondir les bords*/
background-color: #F2F7F6;
background-image: url();
padding-top: 0px;
padding-right: 0px; /*pas touche*/
padding-left: 0px; /*pas touche*/
padding-bottom: 0px; /*pas touche*/
font-size:17px; /*grandeur du texte*/
font-weight: bold; /*texte en gras*/
text-shadow: #C0C0C0 1px 1px 1px;
text-align: center; /*texte aligné au milieu*/
font-color : #COLOR  ; /*couleur du texte*/
}

.partiedroite {
-moz-border-radius : 50px 50px 50px 50px;/*pour arrondir les bords*/
font-size : 15px ; /*grandeur du texte*/
background-color: #F2F7F6;
background-image: url();
border-left : 0px dotted white ; /*séparation du tableau de gauche et du tableau de droite par une ligne, peu être changé en DOTTED, SOLID, DOUBLE, etc*/
padding-left : 25px ;
padding-right: 25px;
padding-top: -5px;
padding-bottom: 5px;}

.connectés {
-moz-border-radius : 50px 50px 50px 50px;/*pour arrondir les bords*/
font-size : 15px ; /*grandeur du texte*/
background-color: #F2F7F6;
background-image: url();
border-left : 0px dotted white ; /*séparation du tableau de gauche et du tableau de droite par une ligne, peu être changé en DOTTED, SOLID, DOUBLE, etc*/
padding-left : 25px ;
padding-right: 25px;
padding-top: -5px;
padding-bottom: 5px;}

.lastpost-avatar {
float: left;
padding: 2px;
}
.lastpost-avatar img {
width: 31px;
height: 50px;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
}

.selectCode { float:right; text-transform: uppercase; cursor:pointer; }
div.cont_code { clear: right; }

.poster-profile img {max-width: 216px;}

.ascenseur {
position: fixed; /*--- Cette ligne permet de toujours afficher l'ascenseur à l'écran ---*/
bottom: 10px; /*--- On le place à XX px du haut de l'écran ---*/
right: 20px; /*--- On le place à XX px de la gauche de l'écran ---*/
}

              #fa_chat_container {
          background:#FFF;
          border:1px solid #556682;
          border-radius:3px;
          position:fixed;
          right:3px;
          z-index:999;
          overflow:hidden;
          min-width:500px;
          min-height:250px;
          transition:300ms;
        }
     
        #fa_chat {
          border:none;
          width:100%;
          height:100%;
        }
     
        #fa_chat_button {
          color:#FFF;
          line-height:30px;
          margin-left:10px;
          padding:0 5px;
          cursor:pointer;
        }
     
        #fa_chat_button.fa_chat_active {
          color:#333;
          background:#FFF;
        }



.bgAdministrateur td.row1, .bgAdministrateur td.row2{
  border-top: 10px solid #679934;
} /*Couleur ligne verte Staff */
.bgOmbrune td.row1, .bgOmbrune td.row2{
  border-top: 10px solid #9B4300;
} /*Couleur ligne orange Ombrune */

#presa{
  background-image: url(https://2img.net/r/hpimg11/pics/411405Fond.png);
  padding: 15px;
  width:485px;
  opacity:0.8;
  box-shadow: 1px 2px 2px 1px darkgray;
}
#presa > .cadre{
  width:480px;
}
#presa > .cadre img{
  border: 1px solid darkgray;
  padding: 2px;
  background: white;
}
#presa > .cadre > .nom{
  color: rgba(139,90,43,0.7);
  text-shadow: 0px 1px 0px rgba(255,255,255,.3), 1px -1px 0px rgba(0,0,0,1);
  width:400px;
  text-align:center;
  font-family: 'Abril Fatface', cursive;
  font-size:55px;
  line-height: 80%;
  text-transform: uppercase;
  letter-spacing:-1px;
  padding:10px 0px 10px 0px;
  margin-top:-12px;
  opacity: 0.6;
}
#presa > .cadre > .quote{
  font-family: 'Kaushan Script', cursive;
  font-size: 14px;
  text-align: center;
  width: 475px;
  margin-left: 5px;
  margin-bottom: 10px;
  color: rgba(0,0,0,0.7);
  text-shadow: 1px -1px 0px rgba(0,0,0,0.4);
  background: rgba(139,90,43,0.7);
}
#presa > .cadre > .intro{
  width: 480px;
  display: flex;
  flex-flow: column wrap;
  max-height: 350px;
  background: white;
  padding-top: 10px;
  border-bottom: 4px solid #5B4E46;
}
#presa > .cadre > .intro > .infos{
  text-align:justify;
  font-family:verdana;
  font-size:10px;
  width: 50%;
  padding: 5px 5px 10px 10px;
  margin: auto;
  height: 310px;
  line-height:normal;
  background-color: #F8F6F3;
  float: left;
}
#pa > .contenu, #ca > .contenu{
  overflow: auto;
  height: 250px;
}
#id > .contenu > .imp, #presa > .cadre > .court > .contenu > .imp{
  color: #444;
  text-transform: uppercase;
}
#id > .contenu > .ex{
  color: green;
}
#pa .titre, #ca .titre, #presa .titre{
  font-family: great vibes;
  font-size: 42px;
  text-align:center;
  color:#5B4E46;
  margin-top:3px;
  margin-bottom:-10px;
  text-shadow: #fff 1px 1px 3px, #fff -1px 1px 3px, #fff -1px -1px 3px, #fff 1px -1px 3px;
}
#presa > .cadre > .intro > .ava{
  align-self: flex-end;
  width: 200px;
  height: 320px;
  margin: auto;
  padding-right: 10px;
  padding-bottom: 10px;
}
#presa > .cadre > .intro > .infos > .onglets{
  text-align: center;
  text-transform: uppercase;
  margin: auto;
}
#presa > .cadre > .intro > .infos > .onglets input[type="radio"] {
  display: none;
}
#presa > .cadre > .intro > .infos > .onglets label {
  display: inline-block;
  background-color: #ddd;
  margin: 0px 1px;
  padding: 4px 6px;
  cursor: pointer;
  color: rgb(139,90,43);
}
#presa > .cadre > .intro > .infos > .onglets input[type="radio"]:checked+label {
  background-color: #bbb;
}
#id, #pa, #ca{
  display: none;
  text-align: justify;
  text-transform: none;
}
#car:checked ~ #ca, #par:checked ~ #pa, #ide:checked ~ #id{
  display: block;
}
#presa > .cadre > .large, #presa > .cadre > .court{
  padding: 5px;
  line-height:normal;
  width:470px;
  background-color: #F8F6F3;
  text-align:justify;
  border-bottom: 4px solid #5B4E46;
}
#presa > .cadre > .large{
  max-height:310px;
  overflow:auto;
  font-size:12px;
}
#presa > .cadre > .court{
  max-height: 110px;
  display: flex;
  font-size:10px;
}
#presa > .cadre > .court img{
  align-self: safe center;
  width: 100px;
  height: 100px;
}
#presa > .cadre > .court > .contenu{
  overflow:auto;
  margin-left: 10px;
}
#presa > .credits{
  text-align: center;
  font-family: courrier new;
  font-size:7px;
  text-transform:uppercase;
  margin-top: 5px;
  -moz-transition: .35s ease-in-out;
  -webkit-transition: .35s ease-in-out;
  -o-transition: .35s ease-in-out;
  transition: .35s ease-in-out;
}
#presa > .credits:hover{
  text-shadow: #fff 1px 1px 3px, #fff -1px 1px 3px, #fff -1px -1px 3px, #fff 1px -1px 3px;
}

/************* QEEL PAR PHANTASMAGORIA sur PRD *******/

.fond_qeel {background-color: #F8F1DE; width: 780px; }
.bloc_stat1{ background-color: #ebd8d0; border: 1px solid #cc9e8e; width: 250px; height: 130px; overflow: auto;
padding: 7px; font-size: 9px; line-heigh: 10px; text-align : justify;}
 .bloc_stat2 {background-color: #ebd8d0; border: 1px solid #cc9e8e; width: 520px; height: 50px; overflow: auto;
  padding: 7px; font-size: 9px; line-heigh: 10px; text-align : justify; margin-top: -2px;}
.groupe { text-transform : Capitalize; font-family: 'Trebuchet MS', cursive; text-shadow: 1px 1px 0px grey;
  font-size: 22px; margin-top: -10px; letter-spacing:3px;}

/****************** CODAGE CATEGORIES PAR MAGMA. ***********************/

.lastpost-avatar img {
width: 45px;
height: 72px; border: 2px double #FF00FF; padding: 0px;
  filter: grayscale(0);
        -webkit-filter: grayscale(0);
        -moz-filter: grayscale(0);
        -o-filter: grayscale(0);
        -ms-filter: grayscale(0); border-radius: 0px; -webkit-radius: 0px;  }

.lastpost-avatar img:hover {
border: 2px double #dec7fa; padding: 0px;
    filter: grayscale(80%); -webkit-filter: grayscale(80%);
  -moz-filter: grayscale(80%); -ms-filter: grayscale(80%); -o-filter: grayscale(80%);
  opacity: 0.9; -htm-transition:1s; -moz-transition:1s; -o-transition:1s; -webkit-transition:1s;
 filter: grayscale(80%); -webkit-filter: grayscale(80%);
  -moz-filter: grayscale(80%); -ms-filter: grayscale(80%); -o-filter: grayscale(80%);
  opacity: 0.8;    /* l'opacite que vous voulez au depart */
    -ms-filter: "prodig:DXImageTransform.Microsoft.Alpha(Opacity=25)"; /* Hack IE8 */
    filter: alpha(opacity = 25); /* Hack IE 5-7 */
 -htm-transition:1s; -moz-transition:1s; -o-transition:1s; -webkit-transition:1s; 
  -webkit-transition: opacity 0.5s ease-in-out;/* transition pour Chrome et Safari */
    -moz-transition: opacity 0.5s ease-in-out;/* transition pour Firefox */
    -o-transition: opacity 0.5s ease-in-out;/* transition pour Opéra */
    transition: opacity 0.5s ease-in-out;  }
.nav img {max-width:140px;}
.modifcat { background-color : #f6f3f3; width: 950px; padding-bottom: 10px;} /*** le fond de la catégorie ***/
.catégoz{ position : relative ; top : 30px; left: 13px;} /*** l'emplacement des titres catégories ***/
.catégoz h2 { font-size: 35px; font-family: Dorsa; letter-spacing: 1px; color:#c4c4c4;font-weight: bold;
  text-transform: uppercase; text-shadow: 0 1px 0 #fff;} /*** le style des titres des catégories ***/
 
.statdescrip { border-radius: 2px; -webkit-border-radius: 2px; width: 350px; height: 115px;
  background-color: #fff; border:1px solid #eae6e2;  margin-top: -16px; padding-left: 4px;  padding-right: 4px;
  padding-boddom: 4px;} /*** le style du bloc des descriptions ***/
.descrip_bloc1 { width: 335px; height: 80px; overflow:auto; text-align: justify;  line-height: 11px; padding: 4px;
 font-family: Tahoma; padding-bottom: 6px; font-size: 10px; background-color: #f7f1ff; border:1px solid #eae6e2;} /*** le style des descriptions ***/
.statistiques_cat {background-color: #fff;  width: 135px; height: 115px;
  border-radius: 2px; -webkit-border-radius: 2px; margin-top: -7px; border:1px solid #eae6e2;} /*** le style des statistiques en général ***/
.stat_general{ width: px; height: 86px; overflow:auto; font-size: 9px; line-height: 13px;
 font-family: 'Roboto Condensed', sans-serif;  font-size: 11px;}

.sousfofo {

padding-top: -15px; padding-bottom : 9px; text-align: left; height: 109px; width:150px;
background-image : url('http://img15.hostingpics.net/pics/693728soustit.png');
    border-radius: 2px; -webkit-border-radius: 2px;margin-left: -4px; border:1px solid #eae6e2;}
.sousfofo a { overflow: x;
color: #C0C0C0; width: 142px!important; display:inline-block; border-collapse: separate; height : 6px;
font-family: Arial; background-color: #f7f1ff; line-height: 12px; padding: 2px; margin-left: 2px; margin-right: 2px; margin-bottom: 2px;
  margin-top: 1px;  -webkit-transition-property:color letter-spacing; -webkit-transition-duration:0.5s;
  -webkit-transition-timing-function:ease-in; font-weight: bold;
/* Bientôt supporté par Firefox */
  -moz-transition-property:color letter-spacing; -moz-transition-duration:0.5s;
  -moz-transition-timing-function:ease-in;
font-size: 8px; text-transform : lowercase; }

.sousfofo a:hover {
color: #93807B;
 font-family: Arial;
text-shadow: 0px 0px 2px solid #fff; font-size: 8px; text-transform : lowercase; }

.forumutitre { padding-top: -50px!important;}
.forumtitre a { color: #c4c4c4; font-size: 25px; font-family: Dorsa; letter-spacing: 2px;
text-transform: uppercase; text-shadow: 0 1px 0 #fff; padding-top: -20px!important;
  -webkit-transition-property:color letter-spacing; -webkit-transition-duration:0.5s;
  -webkit-transition-timing-function:ease-in; font-weight: bold;
/* Bientôt supporté par Firefox */
  -moz-transition-property:color letter-spacing; -moz-transition-duration:0.5s;
  -moz-transition-timing-function:ease-in;
/* … et lorsque ce sera standardisé */ margin-left: 100px;
  transition-property:color letter-spacing; transition-duration:0.5s; transition-timing-function:ease-in;}

.forumtitre a:hover {color:#93807B !important; letter-spacing: 2px;}
.stat1 {font-size: 8px; font-family: Tahoma; letter-spacing: 0px; color:#000; height : 10px; background-color: #dbd4d0;
  text-transform: uppercase;  text-align: center;  }
.forumdesc1 {text-align: center;  font-size: 10px; padding-top: 15px; }
.image_cate {margin-top: 20px;}

/********************* FIN DES CODES CATEGORIES ********************************/



Template :

Code:

<table width="900px" border="0" cellspacing="0" cellpadding="0" align="center" style="margin:auto;">
    <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 -->
   <div id="lep_cat">       
   <div class="cat_header">{catrow.tablehead.L_FORUM}</div>
          <!-- END tablehead -->

        <!-- BEGIN cathead -->
        <!-- END cathead -->
       
        <!-- BEGIN forumrow -->
          <div class="forum">
            <div class="titre">
              <a href="{catrow.forumrow.U_VIEWFORUM}">{catrow.forumrow.FORUM_NAME}</a>
            </div>
            <div class="data"><span>{catrow.forumrow.TOPICS} SUJETS  â–¼  {catrow.forumrow.POSTS} MESSAGES</span></div>
            <div class="cat_content">
              <div class="contain">
                <div class="lieu">
              <div class="ssf">{catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}</div>
                  </div>
              <script type="text/javascript">$('.ssf').each(function(){$(this).html($(this).html().replace(/>, /g,"><br /> "));});</script>
              <div class="forum_desc">
                <div class="desc">{catrow.forumrow.FORUM_DESC}</div>
              </div>
              </div>
              <div class="last_post">
                <!-- BEGIN avatar -->
                            <span class="lastpost-avatar">{catrow.forumrow.avatar.LAST_POST_AVATAR}</span>
                            <!-- END avatar -->

                     <span class="infos">
                     <!-- BEGIN switch_topic_title -->
                     <a href="{catrow.forumrow.U_LATEST_TOPIC}" title="{catrow.forumrow.LATEST_TOPIC_TITLE}">{catrow.forumrow.LATEST_TOPIC_NAME}</a><br />
                     <!-- END switch_topic_title -->
                     {catrow.forumrow.USER_LAST_POST}
                     </span>
    </div>
    <div class="new"><img src="{catrow.forumrow.FORUM_FOLDER_IMG}" /></div>
  </div>
          </div>
        <!-- END forumrow -->
        <!-- BEGIN catfoot -->

        <!-- BEGIN inc -->
        <!-- END inc -->
   
        <!-- END catfoot -->
        <!-- BEGIN tablefoot -->
<div class="cat_footer">
  </div>
</div>
        <!-- END tablefoot --><!-- END catrow -->

CSS :

Code:

/* Bannière */
.headerbar{
  height: 0 !important;
  width: 100%;
  background-color: transparent !important;
  padding-top: 26.04% !important;
  box-shadow: 0px 5px 20px black;
}
#headerbar-top{
  position: absolute;
  top: 0;
  width: 100%;
}
/* Affichage des catégories */
/* Conteneur principal */
#lep_cat {
  width: 900px;
  background: #ccc;
  margin: 0 auto 50px auto;
}
/* design des liens */
#lep_cat a {
  text-decoration: none;
  font-variant: small-caps;
}
/* taille des images en haut et en bas de la catégorie */
#lep_cat .cat_header,
#lep_cat .cat_footer {
  height: 85px;
  opacity: 0.6;
}
/* Header : définition du background (format 900*85) */
#lep_cat .cat_header {
  background: url("http://nsa39.casimages.com/img/2018/04/10/180410080704395009.png");
  background-size: contain;
}
/* Style du titre de la catégorie */
#lep_cat .cat_header h2{
  color: rgba(139, 90, 43, 0.7);
  text-shadow: 0px 1px 0px rgba(255, 255, 255, 0.3),
    1px -1px 0px rgba(0, 0, 0, 1);
  text-align: center;
  font-family: "Abril Fatface", cursive;
  font-size: 55px;
  text-transform: uppercase;
  letter-spacing: -1px;
}
/* Création du bloc contenant le forum */
#lep_cat .forum {
  text-align: center;
  width: 100%;
}
/* Design du titre du forum */
#lep_cat .forum .titre {
  text-transform: uppercase;
  font-size: 26px;
}
/* Nombre de sujets et de messages */
#lep_cat .forum .data {
  margin: 0 5px;
  text-align: center;
  position: relative;
}
/* Style du texte -nombre de sujets et de message */
#lep_cat .forum .data span {
  color: #fff;
  position: relative;
  display: inline-block;
  width: 97%;
  font-size: 10px; /* à modifier pour changer la taille de la ligne */
  margin: auto;
  z-index: 1;
}
/* ligne se trouvant derrière les infos */
#lep_cat .forum .data span:before {
  content: " ";
  background: brown; /* couleur de fond modifiable */
  position: absolute;
  top: 0;
  left: -10px;
  right: -10px;
  bottom: 0;
  z-index: -1;
  transform: skewX(-15deg);
}
/* bloc contenant la description, le dernier posteur, etc. */
#lep_cat .cat_content {
  padding: 5px 5px 10px 5px;
  height: 145px;
  display: flex;
  justify-content: space-between;
}
/* bloc contenant la description et les sous forums UNIQUEMENT */
#lep_cat .cat_content .contain{
  position: relative;
  overflow: hidden;
  width: 610px;
}
/* style du bloc contenant les sous-forums et de l'image de description */
#lep_cat .cat_content .contain .lieu,
#lep_cat .cat_content .contain .forum_desc .desc img {
  width: 280px;
  height: 130px;
}
#lep_cat .cat_content .contain .lieu {
  overflow: hidden;
  background: white;
  z-index: 0;
}
#lep_cat .cat_content .contain .desc img {
  transition: all 0.5s ease;
  position: absolute;
  margin-top: -1px;
  left:-285px;
  z-index: 2;
}
/* effet au survol de l'image de description */
#lep_cat .cat_content .contain:hover .desc img {
  transform: translatex(-100%);
  -webkit-transform: translatex(-100%);
}
/* style des sous-forums */
#lep_cat .cat_content .contain .lieu .ssf {
  position: relative;
  padding: 0 3px;
  transition: all 0.5s ease;
  text-align: center;
  z-index: 1;
}
/* style du bloc de description du forum */
#lep_cat .cat_content .contain .forum_desc {
  width: 320px;
  height: 140px;
  width: 335px;
  background-color: white;
  padding: 5px;
  text-align: justify;
  color: black;
  font-size: 13px;
  position: relative;
  margin: 0;
  margin-top: -134px;
  margin-left: 285px;
}
/* style de la zone de texte de description du forum */
#lep_cat .cat_content .contain .forum_desc .desc {
  height: 100%;
  padding: 0 3px;
  overflow: auto;
}
/* bloc contenant les infos relatives au dernier post */
#lep_cat .cat_content .last_post {
  width: 210px;
  padding: 5px;
  background-color: beige;
  display: flex;
}
/* bloc contenant l'image nouveau message/pas de nouveau message */
#lep_cat .cat_content .new {
  width: 60px;
  background: white;
}
/* style de l'avatar du dernier posteur (retouche du CSS de base) */
.lastpost-avatar{
  padding: 0;
}
.lastpost-avatar img{
  border-radius: 0;
  padding: 0;
  height: 120px;
  width: 75px;
  -webkit-filter: sepia(100%);
  -moz-filter: sepia(100%);
  filter: sepia(100%);
  transition: all 0.5s ease;
}
/* retrait de l'effet sépia au survol */
.lastpost-avatar img:hover {
  -webkit-filter: sepia(0%);
  -moz-filter: sepia(0%);
  filter: sepia(0%);
}
/* style du texte contenant le titre, la date, l'heure... du dernier post */
#lep_cat .cat_content .last_post .infos {
  text-align: center;
  font-size: 11px;
  align-self: center;
  padding-left: 10px;
}
/* image de bas de la catégorie */
#lep_cat .cat_footer {
  background: url("http://nsa39.casimages.com/img/2018/04/10/180410080701232760.png");
  background-size: contain;
}

QEEL

CSS

Code:

#qeel {
  width: 900px;
  height: 300px;
  display: flex;
  margin: auto;
}
#qeel .left,
#qeel .mid,
#qeel .right {
  width: 300px;
  height: 300px;
}
#qeel .mid {
  display: inline-flex;
  flex-direction: column;
  justify-content: space-around;
}
#qeel .mid .titre {
  background: lightgray;
}
#qeel .mid .last_user {
  height: 100px;
  padding: 5px;
}
#qeel .mid .stats {
  text-align: center;
}
#qeel .mid .connect {
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  height: 180px;
  padding-left: 5px;
}
#qeel .mid .online .noms p,
#qeel .mid .connect div p {
  overflow: auto;
  margin-top: 0px;
  border-bottom: 1px dotted gray;
}
#qeel .mid .connect div {
  height: 30%;
}
#qeel .mid .connect div p {
  height: 80%;
}
#qeel .mid .last_user {
  display: inline-flex;
  align-items: center;
  text-align: center;
}
#qeel .mid .last_user img {
  height: 90px;
  border: 1px solid gray;
}
#qeel .mid .last_user span {
  margin-left: 5px;
  width: 100%;
}
#qeel .mid .last_user span a {
  font-variant: small-caps;
  text-decoration: none;
}
#qeel .right {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
#qeel .right .grp {
    line-height: 1em;
    height: 20px;
}
#qeel .right .grp a {
  font-variant: small-caps;
  text-decoration: none;
}
#qeel .right .grp div {
  display: inline-block;
  position: relative;
  margin-left: -742px;
  width: 240px;
  height: 240px;
  background: rgba(255, 255, 255, 0.4);
  padding: 10px;
  display: none;
  overflow: auto;
  text-align: justify;
}
#qeel .right .grp a:hover ~ div {
  display: inherit;
}
#qeel .right .grp:nth-child(1) div{top: -85px; left: 35px;}
#qeel .right .grp:nth-child(2) div{top: -105px; left: 75px;}
#qeel .right .grp:nth-child(3) div{top: -125px; left: 45px;}
#qeel .right .grp:nth-child(4) div{top: -145px; left: 37px;}
#qeel .right .grp:nth-child(5) div{top: -165px; left: 95px;}
#qeel .right .staff a {
  color: #689a35;
}
#qeel .right .vag a {
  color: #e6a327;
}
#qeel .right .ymb a {
  color: #cc6308;
}
#qeel .right .estre a {
  color: #ad1a1a;
}
#qeel .right .stam a {
  color: #543425;
}

Templates (à remplacer entièrement)

overall_footer_begin

Code:

<!-- BEGIN html_validation -->
<div>
   <div>
      <div>
         <div>

<div>
   <div>
      <div>
         <div>
            <div>
               <div>
                  <div>
                     <div>
<!-- END html_validation -->
                     </div>
                  </div>
               </div>
            </div>

            <div id="{ID_RIGHT}">
               <!-- BEGIN giefmod_index2 -->
               {giefmod_index2.MODVAR}
               <!-- BEGIN saut -->
               <div style="height:{SPACE_ROW}px"></div>
               <!-- END saut -->
               <!-- END giefmod_index2 -->
            </div>
         </div>
      </div>
   </div>
</div>
         </div>
      </div>
   </div>
</div>

<div id="page-footer">
   <div class="wrap">
      <ul class="footerbar-system">
         <li class="footer-home">
            <a class="icon-home" href="{U_INDEX}" accesskey="h"><i class="ion-ios-home"></i>{L_HOME}</a>
         </li>
         <li class="rightside">
<!-- BEGIN html_validation -->
         </li>
      </ul>
   </div>
</div>
<!-- END html_validation -->

index_body

Code:

{JAVASCRIPT}

<!-- BEGIN switch_user_login_form_header -->
<div class="panel">
   <form action="{S_LOGIN_ACTION}" method="post" name="form_login">
      <div class="user_login_form center">
         <input placeholder="{L_USERNAME}" class="inputbox fl_username" type="text" size="10" name="username" />
         <input placeholder="{L_PASSWORD}" class="inputbox fl_password" type="password" size="10" name="password" />
         <br />
         <label>{L_AUTO_LOGIN}: <input class="radio" type="checkbox" name="autologin" {AUTOLOGIN_CHECKED} /></label>
         {S_HIDDEN_FIELDS}<input class="mainoption button1" type="submit" name="login" value="{L_LOGIN}" />
            <!-- BEGIN switch_social_login -->
            <div class="social_btn">
                <!-- BEGIN fb_connect -->
                <div class="fb-login-button"></div>
                <!-- END fb_connect -->
                <!-- BEGIN topicit_connect -->
                <div class="ti-connect"></div>
                <!-- END topicit_connect -->
            </div>
            <!-- END switch_social_login -->
      </div>
   </form>
</div>
<!-- END switch_user_login_form_header -->

<!-- BEGIN message_admin_index -->
   <div class="panel introduction">
      <!-- BEGIN message_admin_titre -->
         <div class="h3">{message_admin_index.message_admin_titre.MES_TITRE}</div>
      <!-- END message_admin_titre -->

      <!-- BEGIN message_admin_txt -->
         <div class="mes-txt">{message_admin_index.message_admin_txt.MES_TXT}</div>
      <!-- END message_admin_txt -->
   </div>
<!-- END message_admin_index -->

{CHATBOX_TOP}

{BOARD_INDEX}

<!-- BEGIN disable_viewonline -->
   <div id="qeel">
  <div class="left">
    <img src="http://nsa39.casimages.com/img/2018/04/14/180414050545882440.png" />
  </div>
  <div class="mid">
    <div class="stats">
      <span id="nbP">{TOTAL_POSTS} messages</span> - <span id="nbJ">{TOTAL_USERS} joueurs</span>
      <script type="text/javascript">document.getElementById('nbP').innerHTML=document.getElementById('nbP').innerHTML.replace(/Nos membres ont posté un total de /," ") .replace(/messages/," ");</script>
      <script type="text/javascript">document.getElementById('nbJ').innerHTML=document.getElementById('nbJ').innerHTML.replace(/Nous avons /," ") .replace(/membres enregistrés/," ") .replace(/membre enregistré/," ");</script>
    </div>
    <div class="connect">
      <div class="noms">
        <span id="uO">{TOTAL_USERS_ONLINE}</span>
          <script type="text/javascript">
document.getElementById('uO').innerHTML=document.getElementById('uO').innerHTML.replace(/utilisateur en ligne/,"curieux à St Amans");
document.getElementById('uO').innerHTML=document.getElementById('uO').innerHTML.replace(/utilisateurs en ligne/,"curieux à St Amans");           
document.getElementById('uO').innerHTML=document.getElementById('uO').innerHTML.replace(/Enregistré/,"Particulier");
document.getElementById('uO').innerHTML=document.getElementById('uO').innerHTML.replace(/Enregistrés/,"Particuliers");
document.getElementById('uO').innerHTML=document.getElementById('uO').innerHTML.replace(/Invisible/,"Estre");
document.getElementById('uO').innerHTML=document.getElementById('uO').innerHTML.replace(/Invisibles/,"Estres");
document.getElementById('uO').innerHTML=document.getElementById('uO').innerHTML.replace(/Invité/,"Ordinaire");
document.getElementById('uO').innerHTML=document.getElementById('uO').innerHTML.replace(/Invités/,"Ordinaires");
        </script>
        <span id="erg">{LOGGED_IN_USER_LIST}</span>
        <script type="text/javascript">document.getElementById('erg').innerHTML=document.getElementById('erg').innerHTML.replace(/Utilisateurs enregistrés/,"Particuliers dans la boucle");</script>
      </div>
      <div class="vus">
        <div class="titre">Vus ces 48 dernières heures </div>
        <span id="hist">{L_CONNECTED_MEMBERS}</span>
        <script type="text/javascript">document.getElementById('hist').innerHTML=document.getElementById('hist').innerHTML.replace(/Membres connectés au cours des 48 dernières heures :/," ");</script>
      </div>
      <div class="anniv">
        <div class="titre">Joyeux anniversaire à</div>
        <p>{L_WHOSBIRTHDAY_TODAY}</p>
      </div>
    </div>
    <div class="last_user">
      <span id="avatar_dernier_membre"></span>
      <span>Bienvenue à <br/><span id="dernier_membre">{NEWEST_USER}</span></span>
      <script type="text/javascript">document.getElementById('dernier_membre').innerHTML=document.getElementById('dernier_membre').innerHTML.replace(/L'utilisateur enregistré le plus récent est /," ")</script>
    </div>
  </div>
  <div class="right">
    <div class="grp staff">
      <a href="http://enfantsparticuliers.forumactif.com/g5-staff">Staff</a>
      <div>Il est là pour vous aiguiller, vous accompagner et répondre à chacune de vos questions. Les membres du Staff gèrent totalement toutes les intrigues du forum - leurs propres créations - et les autres tâches de modérations (validation des fiches, partenariats, etc...). Ils peuvent avoir un impact sur le jeu grâce aux gages du Maître du Jeu et aux interventions du Narrateur.</div>
    </div>
    <div class="grp vag">
      <a href="http://enfantsparticuliers.forumactif.com/g3-syndrigastis-nomades">Syndrigastis nomades</a>
      <div>Ce groupe-ci comprend les particuliers adultes ou jeunes adultes du forum. Ces personnages là ont choisi de ne pas vivre dans un boucle temporelle, et ce pour diverses raisons : ils peuvent complètement désapprouver le système autoritaire imposé par les Ombrunes et préférer une existence mortelle. Ils peuvent aussi se réunir en petit groupe pour protéger leurs pairs et combattre les menaces qui paralysent le monde particulier : les Estres et les Sépulcreux ou tous les Particuliers mal-intentionnés qui peuplent le monde.</div>
    </div>
    <div class="grp ymb">
      <a href="http://enfantsparticuliers.forumactif.com/g2-ombrunes">Ombrunes</a>
      <div>Protectrices des enfants Particuliers, elles consacrent leur vie entière à la sécurité et à l'éducation des enfants qu'elles recueillent. Ennemies mortelles des Estres, elles cherchent par tous les moyens à les éloigner de leur refuge à particuliers. En effet si les Sépulcreux sont incapables d'entrer dans les boucles temporelles, ce n'est pas le cas des Estres, qui n'ont qu'un seul but : découvrir le secret de l'immortalité des Ombrunes et offrir en pâture des particuliers tout frais aux Sépulcreux, afin qu'ils deviennent des Estres à leur tour.</div>
    </div>
    <div class="grp estre">
      <a href="#">Estres</a>
      <div>Description du groupe 4</div>
    </div>
    <div class="grp stam">
      <a href="http://enfantsparticuliers.forumactif.com/g4-boucle-de-st-amans">Boucle de St Amans Valtoret</a>
      <div>Les pouvoirs des particuliers se déclarent dans l'enfance, entre 5 et 11 ans. S'ils ne sont pas nécessairement toujours handicapant dans la vie avec autrui, ils attirent toujours - selon leur puissance et de leur utilisation - les Creux alentours.
Inès Pomarine vit depuis 1952 dans la boucle de St Amans Valtoret, dans le Tarn, et recueille les enfants de tout le sud-ouest de la France.</div>
    </div>
  </div>
</div>

   <!-- BEGIN switch_chatbox_activate -->
      <div class="block">
         <div class="h3">
            <a href="{S_JOIN_CHAT}" target="ChatBox"><i class="ion-ios-chatboxes-outline"></i>{CHATBOX_NAME}</a>
            <!-- BEGIN switch_chatbox_popup -->
               <div id="chatbox_popup"></div>
               <script type="text/javascript">
                  insertChatBoxPopup('{disable_viewonline.switch_chatbox_activate.switch_chatbox_popup.U_FRAME_CHATBOX}', '{L_CLICK_TO_JOIN_CHAT}');
               </script>
            <!-- END switch_chatbox_popup -->
         </div>
         {TOTAL_CHATTERS_ONLINE}: {CHATTERS_LIST}
      </div>
   <!-- END switch_chatbox_activate -->
<!-- END disable_viewonline -->

{CHATBOX_BOTTOM}

<!-- BEGIN switch_user_login_form_footer -->
<div class="panel">
   <form action="{S_LOGIN_ACTION}" method="post" name="form_login">
      <div class="user_login_form center">
         <input placeholder="{L_USERNAME}" class="inputbox fl_username" type="text" size="10" name="username" />
         <input placeholder="{L_PASSWORD}" class="inputbox fl_password" type="password" size="10" name="password" />
         <br />
         <label>{L_AUTO_LOGIN}: <input class="radio" type="checkbox" name="autologin" {AUTOLOGIN_CHECKED} /></label>
         {S_HIDDEN_FIELDS}<input class="mainoption button1" type="submit" name="login" value="{L_LOGIN}" />
         <!-- BEGIN switch_social_login -->
            <div class="social_btn">
                <!-- BEGIN fb_connect -->
                <div class="fb-login-button"></div>
                <!-- END fb_connect -->
                <!-- BEGIN topicit_connect -->
                <div class="ti-connect"></div>
                <!-- END topicit_connect -->
            </div>
            <!-- END switch_social_login -->
      </div>
   </form>
</div>
<!-- END switch_user_login_form_footer -->

<!-- BEGIN switch_legend -->
<ul id="picture_legend">
   <li><img src="{FORUM_NEW_IMG}" alt="{L_NEW_POSTS}" />{L_NEW_POSTS}</li>
   <li><img src="{FORUM_IMG}" alt="{L_NO_NEW_POSTS}" />{L_NO_NEW_POSTS}</li>
   <li><img src="{FORUM_LOCKED_IMG}" alt="{L_FORUM_LOCKED}" />{L_FORUM_LOCKED}</li>
</ul>
<!-- END switch_legend -->

{AUTO_DST}

profile_view_body (dans la section Profil des templates)

Code:

<h1 class="page-title">{L_VIEWING_PROFILE}</h1>

<div class="panel bg1">
   <div class="column1">
      <div class="h3">{L_USER_PRESENCE}</div>
      <dl class="left-box details" style="width: 80%;">
         <dt>{L_AVATAR_IMG}</dt><dd><span id="avatar_membre">{AVATAR_IMG}</span></dd>
      </dl>
      <dl class="left-box details" style="width: 80%;">
         <dt>{L_RANK}:</dt><dd><strong>{POSTER_RANK}</strong></dd>
         <!-- BEGIN switch_show_status -->
         <dt>{L_STATUT}:</dt><dd><strong>{USER_ONLINE}</strong></dd>
         <!-- END switch_show_status -->
      </dl>
      <!-- BEGIN switch_allow_friendsfoes -->
      <dl class="left-box details" style="width: 80%;margin-top:10px;margin-bottom:10px">
         <dt>{L_FRIENDS_AND_FOES}:</dt><dd><strong>{FRIENDSFOES}</strong></dd>
      </dl>
      <!-- END switch_allow_friendsfoes -->
      <!-- BEGIN switch_auth_user -->
      <dl class="left-box details" style="width: 80%;margin-top:10px;margin-bottom:10px">
         <dt>{L_ADMINISTRATE_USER}:</dt><dd><strong>{ADMINISTRATE_USER}{BAN_USER}</strong></dd>
      </dl>
      <!-- END switch_auth_user -->
   </div>
   <div class="column2">
      <div class="h3">{L_PROFILE}</div>
      <!-- BEGIN profile_field -->
      <dl id="field_id{profile_field.ID}" class="left-box details" style="width: 80%;">
         <dt>{profile_field.LABEL}</dt> <dd>{profile_field.CONTENT}<!-- BEGIN profil_type_user_posts --> [{POST_PERCENT_STATS} / {POST_DAY_STATS}]
            <br /><span style="margin-left: 10px;"><a rel="nofollow" href="/st/{PUSERNAME}">{L_SEARCH_USER_POSTS} :</a></span>
            <br /><span style="margin-left: 15px;">- <a rel="nofollow" href="/sta/{PUSERNAME}">{L_TOPICS}</a></span>
            <br /><span style="margin-left: 15px;">- <a rel="nofollow" href="/spa/{PUSERNAME}">{L_POSTS}</a></span><!-- END profil_type_user_posts --></dd>
      </dl>
      <!-- END profile_field -->
   </div>
</div>

<div class="panel bg2">
   <div class="column1">
   <form action="{S_PROFILE_ACTION}" method="post" name="post">
      <div class="h3">{L_CONTACT} {USERNAME}</div>
      <!-- BEGIN contact_field -->
      <dl id="field_id{contact_field.ID}" class="left-box details" style="width: 80%;">
         <dt>{contact_field.LABEL}</dt> <dd>{contact_field.CONTENT}</dd>
      </dl>
      <!-- END contact_field -->

      <!-- BEGIN switch_admin_user_comment_active -->
      <dl class="details">
         <dt>{L_COMMENTS} :<br /><span class="italic">{L_MODS_AND_ADMINS}</span></dt>
         <dd><textarea class="inputbox" name="admin_user_comment_text" rows="8" cols="30">{ADMIN_USER_COMMENT}</textarea></dd>
      </dl>
      <fieldset class="submit-buttons">
         <input type="hidden" value="update_admin_user_comment" name="mode" />
         <input type="hidden" value="{USER_ID}" name="userid" />
         <input type="submit" class="button2" name="user_comment_maj" value="{L_UPDATE}" />
      </fieldset>
      <!-- END switch_admin_user_comment_active -->
   </form>
   </div>

   <div class="column2">
      <div class="h3">{L_STATS}</div>
      <dl class="left-box details" style="width: 80%;"><dt>{L_LAST_VISITED}: </dt> <dd>{LAST_VISIT_TIME}</dd></dl>
      <!-- BEGIN switch_dhow_mp -->
      <dl class="left-box details" style="width: 80%;"><dt>{L_PRIVATE_MSG}:&nbsp;</dt> <dd>{PRIVATE_MSG}</dd></dl>
      <!-- END switch_dhow_mp -->
   </div>
</div>

<!-- BEGIN switch_rpg -->
<h1 class="page-title">{L_VIEWING_RPG}</h1>
<div class="panel bg1">

   <p style="text-align: center;">{RPG_IMAGE}</p>
   <hr />

   <!-- BEGIN rpg_fields_left -->
   <div class="column1">
      <dl class="details">
         <dt>{switch_rpg.rpg_fields_left.F_NAME} :</dt>
         <dd>{switch_rpg.rpg_fields_left.F_VALUE_NEW}</dd>
      </dl>
   </div>
   <!-- END rpg_fields_left -->

   <!-- BEGIN rpg_fields -->
   <div class="column2">
      <dl class="details">
         <dt>{switch_rpg.rpg_fields.F_NAME} :</dt>
         <dd>{switch_rpg.rpg_fields.F_VALUE_NEW}</dd>
      </dl>
   </div>
   <!-- END rpg_fields -->
   <div class="clear"></div>
   <fieldset class="submit-buttons">
      {U_ADMIN_RPG_NEW}
   </fieldset>
</div>
<!-- END switch_rpg -->
<script src="{JQUERY_ROOT}json/jquery.json-1.3.min.js" type="text/javascript"></script>
<script type="text/javascript">
//<![CDATA[
   $(document).ready(function(){
      $('[id^=field_id]').each(function(){
         if ( $(this).find('.field_editable').is('span, div') )
         {
            $(this).hover(function()
            {
               if( $(this).find('.field_editable.invisible').is('span, div') )
               {
                  $(this).find('.field_editable').prev().addClass('ajax-profil_hover').parent().addClass('ajax-profil_parent').append('<div class="ajax-profil_edit"><img src="{AJAX_EDIT_IMG}" /></div>');
                  $(this).find('.ajax-profil_edit').attr({
                        alt: "{L_FIELD_EDIT_VALUE}",
                        title: "{L_FIELD_EDIT_VALUE}"
                     }).click(function(){
                     $(this).prev().prev().removeClass('ajax-profil_hover').addClass('invisible').next().removeClass('invisible').append('<img src="{AJAX_VALID_IMG}" class="ajax-profil_valid" />').find('input,select');
                     $(this).prev().find('.ajax-profil_valid').attr({
                        alt: "{L_VALIDATE}",
                        title: "{L_VALIDATE}"
                     }).click(function(){
                        var content = new Array();
                        $(this).parent().find('[name]').each(function(){
                           var type_special = $(this).is('input[type=radio],input[type=checkbox]');
                           if ( (type_special && $(this).is(':checked')) || !type_special )
                           {
                              content.push(new Array($(this).attr('name'), $(this).attr('value')));
                           }
                        });
                        var id_name = $(this).parents('[id^=field_id]').attr('id');
                        var id = id_name.substring(8, id_name.length);
                        $.post(
                           "{U_AJAX_PROFILE}",
                           {id:id,user:"{CUR_USER_ID}",active:"{CUR_USER_ACTIVE}",content:$.toJSON(content),tid:"{TID}"},
                           function(data){
                              $.each(data, function(i, item){
                                 $('[id=field_id' + i + ']').find('.field_uneditable').html(item).end().find('.ajax-profil_valid').remove().end().find('.field_editable').addClass('invisible').end().find('.field_uneditable').removeClass('invisible');
                              });
                           },
                           "json"
                        );
                     });
                     $(this).remove();
                  });
               }
            },function()
            {
               if( $(this).find('.field_editable.invisible').is('span, div') )
               {
                  $(this).find('.field_editable').prev().removeClass('ajax-profil_hover');
                  $(this).find('.ajax-profil_edit').remove();
               }
            });
         }
      });
   });
//]]>
</script>

Javascript

Panneau d'administration > Modules > HTML & Javascript > Gestion des pages javascript
Activer la gestion des codes javascript : OUI
Créer un nouveau Javascript (nom : avatar du dernier inscrit, placement : sur l'index)

Code:

$(function(){
$.get($("#dernier_membre a[href^='/u']")[0].href,function(d){
(a=$("#avatar_membre img",$(d))).length&&$("#avatar_dernier_membre").html(a);})
});

http://forum.forumactif.com/t284475-fleche-haut-et-bas-du-forum

Template : overall_header
Après la ligne 217

Code:

<!-- END google_analytics_code -->

Coller :

Code:

<!---- fleche haut------->
<div class="bouhaut"><a href="#top"><img src="https://i62.servimg.com/u/f62/11/27/17/22/haut14.png" class="flecheup" alt="Aller en haut" /></a></div>
  <!----fin  fleche haut------->
<!----fleche bas------->
 <div class="boubas"><a href="#bottom"><img src="https://i62.servimg.com/u/f62/11/27/17/22/bas14.png" class="flechedown" alt="Aller en bas" /></a></div>
  <!----fin  fleche bas------->

CSS :

Code:

/************* FLECHES HAUT ET BAS *******/

.bouhaut { bottom: 90px; right: 20px; position: fixed; z-index: 100; }
.boubas { bottom: 20px; right : 20px; position: fixed; z-index: 100; }

Test : je veux qu'il y ait deux pages.

Test : je veux qu'il y ait deux pages.

Test : je veux qu'il y ait deux pages.