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.

-60%
Le deal à ne pas rater :
OtterBox – Batterie externe avec chargement sans fil Qi 15000 mAh ...
19.99 € 49.99 €
Voir le deal

    Catégories blanches et bleues avec avatar du dernier posteur

    Lunayine
    Lunayine
    FémininAge : 27Messages : 55

    Jeu 12 Mar 2015 - 19:34


    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
    Imari
    Imari
    FémininAge : 41Messages : 68

    Ven 20 Mar 2015 - 23:07

    Merci ^^



    Catégories blanches et bleues avec avatar du dernier posteur 2mzbax4
    Grenouille
    Grenouille
    FémininAge : 28Messages : 49

    Ven 27 Mar 2015 - 20:25

    Merci ! c'est vraiment chouette
    Leelo
    Leelo
    FémininAge : 33Messages : 157

    Mar 21 Avr 2015 - 14:24

    merci
    A-Lice
    A-Lice
    FémininAge : 30Messages : 4939

    Mar 21 Avr 2015 - 19:04

    Hello, ce n'est pas le bon template que tu indiques, fais attention à ce genre de détail parce que chaque template correspond à quelque chose de différent. Je pense que c'est probablement une erreur involontaire mais tout de même, si tu pouvais me virer ce index_body pour me le remplacer par index_box ce serait super !

    Je déplacerai une fois le changement fait (:

    TiGraou
    TiGraou
    MasculinAge : 31Messages : 243

    Sam 23 Mai 2015 - 19:45

    Merci
    Nemesis
    Nemesis
    FémininAge : 33Messages : 218

    Sam 6 Juin 2015 - 5:32

    merci beaucoup pour ce tuto =)
    Malice1329
    Malice1329
    FémininAge : 36Messages : 81

    Lun 8 Juin 2015 - 14:49

    Merci pour ce LS



    ❝ Every Love Story is Beautiful ❞
    Baby, I'm dancing in the dark with you between my arms, Barefoot on the grass, listening to our favorite song,When you said you looked a mess, I whispered underneath my breath But you heard it, darling, you look perfect tonight× BY LIZZOU
    soraya
    soraya
    FémininAge : 33Messages : 38

    Lun 8 Juin 2015 - 18:29

    merci beaucoup pour ce LS. il est magnifique **




       
    Cory Monteith  1982 - 2013 Oh, why you look so sad? Tears are in your eyes come on and come to me now. Don't be ashamed to cry, let me see you through 'cause I've seen the dark side too. ©️ by anaëlle.
    Lunayine
    Lunayine
    FémininAge : 27Messages : 55

    Ven 12 Juin 2015 - 11:39

    Oups, voilà une erreur bien idiote. J'ai modifié cela, merci de me l'avoir fait remarquer.
    CN.June
    CN.June
    FémininAge : 25Messages : 315

    Ven 12 Juin 2015 - 23:01

    Merciiiii du partage !
    Un élément de plus pour embellir le codage des forums Very Happy
    A-Lice
    A-Lice
    FémininAge : 30Messages : 4939

    Sam 13 Juin 2015 - 16:30

    Parfait je déplace donc (:

    Clémentine
    Clémentine
    FémininAge : 32Messages : 223

    Dim 14 Juin 2015 - 18:49

    Merci *_*



    Catégories blanches et bleues avec avatar du dernier posteur 9w9t
    Ciàran
    Ciàran
    FémininAge : 34Messages : 187

    Lun 15 Juin 2015 - 10:28

    C'est superbe oO
    Tatia38
    Tatia38
    FémininAge : 35Messages : 318

    Lun 15 Juin 2015 - 11:40

    C'est super beau merci
    Misery Mind™
    Misery Mind™
    FémininAge : 33Messages : 153

    Lun 15 Juin 2015 - 14:26

    merci !



    ColorTime'Less
    ColorTime'Less
    FémininAge : 27Messages : 106

    Mar 16 Juin 2015 - 17:41

    J'adore **
    Kellen
    Kellen
    FémininAge : 32Messages : 13

    Mar 16 Juin 2015 - 17:46

    Merci
    Bellabimbo444
    Bellabimbo444
    FémininAge : 26Messages : 61

    Mer 17 Juin 2015 - 16:39

    merci !



    .lovely
    .lovely
    FémininAge : 27Messages : 54

    Ven 19 Juin 2015 - 16:52

    merci !!!
    Kiwy Cat
    Kiwy Cat
    FémininAge : 32Messages : 19

    Ven 19 Juin 2015 - 18:17

    Merci *o*
    Airore
    Airore
    FémininAge : 25Messages : 132

    Sam 20 Juin 2015 - 12:04

    Merci !
    SpicAsh
    SpicAsh
    FémininAge : 28Messages : 176

    Sam 20 Juin 2015 - 14:26

    Merci !
    Alonely
    Alonely
    MasculinAge : 30Messages : 43

    Dim 21 Juin 2015 - 0:57

    merci !
    Alaynna
    Alaynna
    FémininAge : 32Messages : 77

    Dim 21 Juin 2015 - 15:11

    Un code vraiment super, il faut que je l'essaye èwé



    -- If we don't have the key we can't open we can't open whatever it is, we don't have, that it unlocks, so what purpose would be served in finding whatever need be unlocked, which we don't have, without first having found the key that unlocks it?
    -- So we're going after this key?
    -- You're not making any sense at all.
    Contenu sponsorisé


      La date/heure actuelle est Jeu 12 Déc 2024 - 7:53