Partagez
Voir le sujet précédentAller en basVoir le sujet suivant
avatar
Robin
Logiciels : Gimp - Notepad
Disponible : Oui
Rappel : Sauf mentions contraires, toutes mes créations sont placées sous Creative Commons.
Pour de plus amples informations, référez-vous aux Conditions Générales d'Utilisation.
http://libre-service.conceptforum.nethttps://www.facebook.com/robin.parady.1https://twitter.com/Paradyr

Catégories

le Sam 17 Sep - 16:41
[A VENIR]


Dernière édition par Robin le Mar 4 Avr - 10:05, édité 2 fois
avatar
Robin
Logiciels : Gimp - Notepad
Disponible : Oui
Rappel : Sauf mentions contraires, toutes mes créations sont placées sous Creative Commons.
Pour de plus amples informations, référez-vous aux Conditions Générales d'Utilisation.
http://libre-service.conceptforum.nethttps://www.facebook.com/robin.parady.1https://twitter.com/Paradyr

Re: Catégories

le Sam 17 Sep - 17:16


CODE HTML :
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 -->

<div class="cate_head"><div class="titre_cate">{catrow.tablehead.L_FORUM}</div></div>
<div class="cate_body">
  <span style="display: block; height: 1px; clear: both;"></span>
  
        <!-- END tablehead -->
 <!-- BEGIN cathead -->

 <!-- END cathead -->
 <!-- BEGIN forumrow -->
  
<center><div class="forum_bloc">
  
 <div class="forum">
    
    <!-- titre du forum -->
    <div class="forumlink"><a href="{catrow.forumrow.U_VIEWFORUM}">{catrow.forumrow.FORUM_NAME}</a></div>
    
    <!-- icone des messages -->
    <div class="forum_icone"><img title="{catrow.forumrow.L_FORUM_FOLDER_ALT}" src="{catrow.forumrow.FORUM_FOLDER_IMG}" alt="{catrow.forumrow.L_FORUM_FOLDER_ALT}" /></div>
    
    <!-- description -->
    <div class="forum_description">{catrow.forumrow.FORUM_DESC}</div>
    
    <!-- sous forum -->
    <div class="sous_forum">{catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}</div>
    
    <!-- stats -->
    <div class="forum_stats"><span class="stats1">{catrow.forumrow.TOPICS} sujets</span> et <span class="stats2">{catrow.forumrow.POSTS} messages</span></div>
    
    <!-- dernier message -->
    <div class="dernier_mess">{catrow.forumrow.LAST_POST}</div>  
  
   </div></div></center>
  
 <!-- END forumrow -->
 <!-- BEGIN catfoot -->

 <!-- END catfoot -->
 <!-- BEGIN tablefoot -->
<span style="display: block; height: 1px; clear: both;"></span>
</div>

<!-- END tablefoot --><!-- END catrow -->

CODE CSS :
Code:
/* DEBUT DES CATEGORIES*/

.forum_bloc
{
    position: relative;
    width: 47%;
    min-width: 550px;
    height: 300px;
    overflow: hidden;
    margin: 5px;
    flex-grow: 1;
    opacity: 0.9;
    transition: 200ms;
    border-radius: 3px;
}

.forum
{
  width: 550px;
  float: left;
  height: 300px;
  margin: 15px 5px;
  background: #3e453d; /* modifiable */
}
.cate_head
{
  clear: both;
  width: 900px;
  margin: auto;
  height: 135px;
}
.cate_body
{
  width: 900px;
  margin: auto;
  background-color: #CBD0CA; /* modifiable */
}
.titre_cate
{
  position: absolute;
  width: 550px;
  text-align: center;
  margin-top: 50px;
  background: #4A5249; /* modifiable */
  margin-left: 175px;
  border: 1px solid #393F38; /* modifiable */
  box-shadow: 0px 0px 2px #313630; /* modifiable */
  border-radius: 100px 10px/10px 100px;
}
.titre_cate h2
{
font-family: 'Alegreya', serif; /* modifiable */
text-transform:uppercase;
font-size: 34px;
padding: 10px
text-shadow: 1px 1px 0px #000;
color: whitesmoke; /* modifiable */
text-decoration: none !important;
margin: auto;
}
.forumlink
{
  position: absolute;
  width: 550px;
  height: 45px;
  background: #4A5249; /* modifiable */
  margin-top: -15px;
  font-size: 25px; /* modifiable */
  text-align: left;
  font-family: 'Alegreya', serif; /* modifiable */
  text-transform:uppercase;
}

.forumlink a{
  text-decoration: none !important;
  padding-left: 10px;
}
.forum_icone
{
  position: absolute;
  width: 150px; /* modifiable selon la taille de votre image */
  height: 75px; /* modifiable selon la taille de votre image */
  margin-left: 225px;
  margin-top: 50px;
  z-index: 1;
}
.forum_description
{
  width: 100%;
  position: absolute;
  overflow: auto;
  width: 550px;
  height: 150px;
  background: whitesmoke; /* modifiable */
  font-size: 11px;
  text-align: justify;
  margin-top: 30px;
}
.forum_description img
{
  float: left;
  margin-right: 5px;
    position:absolute;
    width:550px; height:150px;
    transition:all 0.45s ease-in-out; -webkit-transition:all 0.45s ease-in-out;
}
.forum_description img:hover{
    opacity:0.1;
    }

.sous_forum
{
  position: absolute;
  overflow: auto;
  width: 550px;
  height: 45px;
  background: #4A5249;
  margin-top: 250px;
  font-size:14px; font-family:Fjalla One; text-transform:uppercase; font-color:black !important; /* modifiable */
}
.forum_stats
{
  position: absolute;
  width: 60%;
  height: 10px;
    margin-left: 250px;
    padding-left: 30px;
  font-size: 10px;
  text-align: center;
  color:white !important; /* modifiable */
  margin-top: 0px;
}
.dernier_mess {
    position: absolute;
    z-index: 995;
    width: 550px;
    background: #323731; /* modifiable */
    margin-top: 180px;
    font-size: 15px;
    color: #61654e; /* modifiable */
    height: 70px;
}
/* FIN DES CATEGORIES */

Bon à savoir :Le fond de couleur #CBD0CA peut accueillir un motif à répéter pour habiller chaque catégorie.

L'image en 400x125 est à placer dans l'onglet "adresse de l'image", en dessus de la description de votre catégorie.
Voir le sujet précédentRevenir en hautVoir le sujet suivant
Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum