Terrible

Bienvenue sur Terrible, le forum de libre-service pour vos codages de forums. Venez trouver ici toutes sortes de codes pour agrémenter aussi bien vos templates que vos messages, sans avoir besoin d'inscription !


Terrible :: Code forum :: Divers
avatar
le Dim 23 Juil - 22:44


Au survol du bloc du membre, la date d'inscription s'affiche.

Créditez-moi quelque part sur votre forum si vous utilisez ce code !

Code pour forum en phpBB2. J'utilise la propriété "calc" et comme Forumactif est parfois capricieux sans raison, si ça ne fonctionne pas, cochez la case "non" à " Optimiser votre CSS" dans les options de la feuille de style.


Codes et explications


Dans votre panneau d'administration, Affichage > Templates > Général > Overall_header, copiez et collez le code suivant, après l'ouverture de la balise head :
Code:
<link href="https://fonts.googleapis.com/css?family=Montserrat" rel="stylesheet">

Dans votre panneau d'administration, Affichage > Templates > Général > memberlist_body, remplacez l'intégralité du template par le suivant :
Code:
<form action="{S_MODE_ACTION}" method="get">
<table cellspacing="0" cellpadding="5" border="0" align="center" class="forumline" width="100%">
 <tr>
 <th class="thTop" nowrap="nowrap">{L_ORDER_OR_SELECT}</th>
 </tr>
 <tr>
 <td class="row1">
 <table cellspacing="2" cellpadding="0" border="0" align="center" class="genmed">
 <tr>
 <td width="100%">{L_USER_SELECT} <input type="text" class="post" name="username" maxlength="25" size="20" value="{L_USER_SELECT_VALUE}" />      
 {L_SELECT_SORT_METHOD} {S_MODE_SELECT}      
 {L_ORDER} {S_ORDER_SELECT}     &nbsp;
 {S_HIDDEN_SID}
 <input class="liteoption" type="submit" name="submit" value="{L_SUBMIT}" /></td>
 </tr>
 </table>
 </td>
 </tr>
</table>
</form>
<table class="forumline" width="100%" border="0" cellspacing="1" cellpadding="0">
  <tr><td>
 <div class="membres-bloc">
 <!-- BEGIN memberrow -->

<div class="membres">
 <div class="membres-nom">
 <a href="{memberrow.U_VIEWPROFILE}">{memberrow.USERNAME}</a>
 </div>
 <div class="membres-avatar-fond">{memberrow.AVATAR_IMG}</div>
 <div class="membres-avatar">{memberrow.AVATAR_IMG}</div>
 <div class="membres-bas">
 <div class="membres-mp">{memberrow.PM_IMG}</div>
 <div class="membres-arrivee">Arrivé le <b>{memberrow.JOINED}</b></div>
 <div class="membres-messages"><b>{memberrow.POSTS}</b> messages</div>
 </div>
</div>
 <!-- END memberrow -->
          </div></td></tr>
 <!-- BEGIN switch_no_user -->
 <tr>
 <td class="catBottom" colspan="{switch_no_user.COLSPAN_NUMBER}" height="28" align="center"><span class="gensmall">{switch_no_user.L_NO_USER}</span></td>
 </tr>
 <!-- END switch_no_user -->
</table>
<!-- BEGIN switch_pagination -->
<table width="100%" border="0" cellspacing="0" cellpadding="0">
 <tr>
 <td><span class="nav">{PAGE_NUMBER}</span></td>
 <td align="right"><span class="nav">{PAGINATION}</span></td>
 </tr>
</table>
<br />
<!-- END switch_pagination -->

Enfin, dans Affichage > Images et couleurs > Couleurs et dans le petit onglet Feuille de style CSS, collez le code suivant :
Code:
/*LISTE DES MEMBRES PAR AWFUL*/
/*Bloc principal*/
.membres-bloc {
    background: #ccc;
    padding: 20px 20px 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.membres-bloc::after {
  content: "";
  width: calc(100% / 3 - 10px);
}
/*Bloc membre*/
.membres {
    height: 150px;
    width: calc(100% / 3 - 10px);
    background: red;
    position: relative;
    font-family: 'Montserrat', sans-serif;
    overflow: hidden;
    margin-bottom: 15px;
}
.membres a {
    text-decoration: none!important;
}
.membres-nom {
    position: absolute;
    text-align: center;
    width: 100%;
    top: 10px;
    z-index: 2;
    color: #fff;
}
.membres-avatar-fond img {
    width: 115%;
    margin-top: -100px;
    margin-left: -20px;
    filter: blur(10px);
max-width: none !important;
}
.membres-avatar {
    height: 70px;
    width: 70px;
    border-radius: 50%;
    overflow: hidden;
    position: absolute;
    top: 50px;
    left: calc(50% - 35px);
    border: 3px solid #fff;
    z-index: 2;
}
.membres-avatar img {
    width: 70px;
    margin-top: -30px;
}
.membres-bas {
    width: 100%;
    height: 80px;
    position: absolute;
    bottom: 0;
    background: #fff;
}
.membres-mp {
    background: #e63535;
    position: absolute;
    bottom: 5px;
    right: 5px;
    color: #fff;
    text-decoration: none;
    border-radius: 3px;
    padding: 2px 4px;
    font-size: 11px;
    transition: all 0.3s;
}
.membres-mp img {
    display: none;
}
.membres-mp a:before {
    content: "MP";
    color: #fff!important;
}
.membres-mp:hover {
    background: #ba2626;
}
.membres-messages,
.membres-arrivee {
    text-transform: uppercase;
    position: absolute;
    bottom: 5px;
    left: 7px;
    transition: all 0.3s;
    font-size: 10px;
}
.membres-arrivee {
    left: -100%;
}
.membres:hover .membres-arrivee {
    left: 7px;
}
.membres:hover .membres-messages {
    left: -100%;
}
Permission de ce forum:
Vous pouvez répondre aux sujets dans ce forum