AccueilDernières imagesRechercherS'enregistrerConnexion

Forum de graphisme, codage et game design proposant des tutoriels, astuces, libres services et commandes dans les domaines de l'infographie amateur, de l'intégration web (HTML et CSS essentiellement) ainsi que dans la conception de RPG sur forum.

Le Deal du moment : -60%
OtterBox – Batterie externe avec chargement sans ...
Voir le deal
19.99 €

    Catégories blanches et bleues avec avatar du dernier posteur

    Lunayine
    Lunayine
    FémininAge : 27Messages : 55

    Jeu 12 Mar 2015 - 19:34

    Rappel du premier message :


    Bonjour à tous,

    Voici un LS de catégories réalisé en réponse à la demande de .loumpia


    Aperçu - Live - Version : PHBB2


    Quelques petites précisions
    Couleur des liens : #4861A3
    Couleurs des liens au survol : #6274a3
    Image New/No New/Lock : 137*48 px ( redimensionnement auto )
    Avatar du dernier posteur : 100*160 px ( redimensionnement auto )
    Bleu clair correspondant au fond du forum : #d5e7f5 (à mettre dans le PA si vous voulez cette couleur)
    Séparation des liens de sous-forums : ✩
    Les tailles de polices sont celles que vous avez définies dans votre PA ( la moyenne pour les descriptions et la petite pour les liens et message du dernier posteur )
    Pour obtenir la même police pour les titres, allez lire ce sujet

    Attention, si vous avez déjà modifié votre template index_body par le passé, veillez à le sauvegarder quelque part afin de pouvoir le récupérer si vous vous rendez compte que vous souhaitiez garder certaines de vos modifications en plus de ces nouvelles catégories.
    ( Pensez à sauvegarder vos templates modifiés de manière générale )




    Code à ajouter à votre feuille de style CSS (Panneau d'administrateur > Affichage > Images et Couleurs > Couleurs > CSS) :
    Code:
    #categories {
      background:transparent;
      }
      table#categories td {
      background:#FFFFFC;
      }
      table#categories td a {
      color:#4861A3;
      transition:color linear 0.2s;
      -webkit-transition:color linear 0.2s;
      }
      table#categories td a:hover {
      color:#6274a3;
      transition:color linear 0.2s;
      -webkit-transition:color linear 0.2s;
      }
      table#categories td img.imgnewpost {
      width:137px;
      height:48px;
      }
      table#categories td.newpost {
      border-radius:40px 0px 0px 40px;
      padding-left:10px;
      }
      table#categories td span#nbposts {
      text-transform:uppercase;
      font-size:9px;
      }
    table#categories td span#lastpost {
      height:56px;
      width:127px;
      overflow:visible;
      }
      table#categories td.descriptions {
      border-radius:0px 40px 40px 0px;
      padding-right:10px;
      }
      table#categories div.description {
      padding:5px;
      margin:5px 0px 5px 0px;
      overflow:auto;
      height:80px;
      text-align:justify;
      }
      table#categories div.forumlink {
      text-align:center;
      margin-top:-20px;
      }
      #categories div.forumlink a{
      font-size:20px;
      color:darkblue;
      font-family:'Indie Flower';
      }
      table#categories div#details {
      text-align:center;
      }
      table#categories div.lastpost-avatar {
      height:120px;
      width:80px;
      }
      table#categories div.lastpost-avatar img {
      height:120px;
      width:80px;
      }

    Code à enregistrer dans le template Index_box après avoir effacé son contenu (Panneau d'administration > Affichage > Templates > Général > Index_box Affichage des catégories) :
    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 --><table class="forumline" width="100%" border="0" cellspacing="7" cellpadding="5" id="categories">
       <!-- BEGIN cathead -->
       <tr>
          <td class="{catrow.cathead.CLASS_CAT}" colspan="3" 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>
       </tr>
       <!-- END cathead -->
       <!-- BEGIN forumrow -->
       <tr>
          <td class="newpost" align="center" valign="middle">
             <img class="imgnewpost" title="{catrow.forumrow.L_FORUM_FOLDER_ALT}" src="{catrow.forumrow.FORUM_FOLDER_IMG}" alt="{catrow.forumrow.L_FORUM_FOLDER_ALT}" />
                      <span id="lastpost" class="gensmall"><br /><br />{catrow.forumrow.LAST_POST}</span>
          </td>
                    <td align="center" valign="middle">
                <div class="lastpost-avatar"><!-- BEGIN avatar -->{catrow.forumrow.avatar.LAST_POST_AVATAR}<!-- END avatar --></div>
                    </td>
          <td valign="top" width="100%" class="descriptions">
                      <div class="forumlink"><link href='http://fonts.googleapis.com/css?family=Indie+Flower' rel='stylesheet' type='text/css' /><a class="forumlink" href="{catrow.forumrow.U_VIEWFORUM}">{catrow.forumrow.FORUM_NAME}</a><br />                  <span id="nbposts" class="gensmall"><b>{catrow.forumrow.POSTS}</b> messages dans <b>{catrow.forumrow.TOPICS}</b> sujets</span></div>
                      <div class="description"><span class="genmed">{catrow.forumrow.FORUM_DESC}</span></div>
             <div id="details" class="gensmall">
                              <span id="lienssousforums">{catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}
                                <script type="text/javascript">
                                  jQuery('#lienssousforums').html(jQuery('#lienssousforums').html().replace(/, /g,' ✩ ')).removeAttr('id');
                                </script>
                              </span>
             </div>
          </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 --><div style="color: rgba(0,0,0,0.2); font-weight: bold; font-size: 8px; margin-top: -10px; text-align: center;">©015 Catégories by Lunay on <a href="http://www.never-utopia.com/">NU</a></div>

    « Je ne comprends pas, rien ne s'affiche dans la deuxième case ! »
    Vous devez avoir activé l'affichage de l'avatar du dernier posteur dans votre PA si vous souhaitez qu'il s'affiche. Pour ce faire : Panneau d'Administration > Affichage > Page d'accueil > Structure et hiérarchie > Hiérarchie > Afficher les avatars dans la colonne "Derniers messages" : Oui
    De plus, sur cette même page vous devez choisir la hiérarchie niveau moyen sans séparation des catégories, c'est à dire la deuxième option.


    Je rappelle que le copyright est obligatoire et que vous avez la possibilité de demander de l'aide pour personnaliser votre code dans cette partie. De plus, si vous rencontrez un problème avec ce code, cette partie vous permettra de demander de l'aide.


    Un petit merci ou commentaire est toujours le bienvenu ^^


    Dernière édition par Lunayine le Ven 12 Juin 2015 - 11:43, édité 2 fois
    rosebleudu10
    rosebleudu10
    FémininAge : 34Messages : 189

    Jeu 6 Aoû 2015 - 11:50

    merci
    Emi.
    Emi.
    FémininAge : 33Messages : 83

    Dim 9 Aoû 2015 - 13:02

    merci beaucoup :)
    Inoue Musaki
    Inoue Musaki
    FémininAge : 35Messages : 147

    Lun 10 Aoû 2015 - 11:38

    super coadage j'ai hate de l'utiliser et j'espere pas trop galéré a l'installer
    nuanciel
    nuanciel
    FémininAge : 33Messages : 139

    Lun 10 Aoû 2015 - 14:00

    Merci beaucoup du partage ! Très jolie !
    LickingBoot
    LickingBoot
    FémininAge : 25Messages : 503

    Lun 10 Aoû 2015 - 15:23

    merci



    Catégories blanches et bleues avec avatar du dernier posteur - Page 4 557826ilovedoudousign
    Laakoh
    Laakoh
    FémininAge : 34Messages : 41

    Mar 11 Aoû 2015 - 18:04

    merci :artiste:
    O'Daim
    O'Daim
    FémininAge : 29Messages : 116

    Ven 14 Aoû 2015 - 17:14

    Merci, les catégories sont sympas !
    Merwyn Arehdel
    Merwyn Arehdel
    FémininAge : 25Messages : 304

    Sam 15 Aoû 2015 - 14:29

    Merci :)



    Just want to be yours.
    Socrazy
    Socrazy
    FémininAge : 36Messages : 11

    Sam 15 Aoû 2015 - 17:09

    Merci du partage <3
    plushmasters
    plushmasters
    FémininAge : 32Messages : 71

    Dim 16 Aoû 2015 - 14:22

    j'aime
    Romann
    Romann
    FémininAge : 30Messages : 183

    Dim 16 Aoû 2015 - 15:05

    Merci ^^



    Catégories blanches et bleues avec avatar du dernier posteur - Page 4 Unicor11
    picka234
    picka234
    FémininAge : 59Messages : 636

    Dim 16 Aoû 2015 - 17:25

    merci!!!!
    Lux Caellis
    Lux Caellis
    FémininAge : 31Messages : 23

    Mar 18 Aoû 2015 - 2:47

    Merci beaucoup !
    C'est chouette avec l'avatar du dernier posteur =)
    Castielle
    Castielle
    FémininAge : 29Messages : 33

    Sam 22 Aoû 2015 - 1:28

    Merci beaucoup, pour ce partage :friends:
    NyxBanana
    NyxBanana
    FémininAge : 31Messages : 19

    Dim 23 Aoû 2015 - 3:37

    Merci :)
    Milkiniz
    Milkiniz
    FémininAge : 31Messages : 72

    Dim 23 Aoû 2015 - 11:25

    Merci pour le code ! :friends:
    catinaphone
    catinaphone
    FémininAge : 32Messages : 93

    Dim 23 Aoû 2015 - 13:48

    Joli tout ça ! :o Ca fait clean, j'aime !
    Meika
    Meika
    FémininAge : 24Messages : 12

    Dim 23 Aoû 2015 - 14:47

    merci pour ce partage !
    NanoiHime
    NanoiHime
    FémininAge : 26Messages : 566

    Mar 25 Aoû 2015 - 17:08

    merc !



    Depp
    Depp
    FémininAge : 33Messages : 301

    Mer 26 Aoû 2015 - 16:02

    Merci, c'est super intéressant !! Very Happy



    Catégories blanches et bleues avec avatar du dernier posteur - Page 4 Tumblr_nenygwIlcz1s4u464o1_500
    Solitude
    Solitude
    FémininAge : 49Messages : 294

    Jeu 27 Aoû 2015 - 20:55

    Merci



    ~ Je suis capable du meilleur comme du pire, mais dans le pire c'est moi la meilleure. ~
    Catégories blanches et bleues avec avatar du dernier posteur - Page 4 Sign510
    Meiywa
    Meiywa
    FémininAge : 33Messages : 81

    Ven 28 Aoû 2015 - 18:57

    Grand merci :)
    Chèlha
    Chèlha
    FémininAge : 31Messages : 121

    Sam 29 Aoû 2015 - 14:21

    Merci
    Nemalus
    Nemalus
    FémininAge : 26Messages : 358

    Dim 30 Aoû 2015 - 11:49

    Merci ♥
    Sadistic Syndrome
    Sadistic Syndrome
    FémininAge : 32Messages : 84

    Lun 31 Aoû 2015 - 15:04

    C'est super ! Merci beaucoup ! :3
    Contenu sponsorisé


      La date/heure actuelle est Ven 13 Déc 2024 - 16:47