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.

-20%
Le deal à ne pas rater :
Pack Gigabyte Ecran PC Gamer 27″ LED M27Q (rev2.0) + Radeon RX 6950 ...
749 € 939 €
Voir le deal

    Catégories blanches et bleues avec avatar du dernier posteur

    Lunayine
    Lunayine
    FémininAge : 26Messages : 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
    Indy Solo
    Indy Solo
    FémininAge : 29Messages : 240

    Lun 8 Aoû 2016 - 14:46

    Très beau :) Thanks <3



    Catégories blanches et bleues avec avatar du dernier posteur - Page 10 Sans_t10
    TQHuu
    TQHuu
    MasculinAge : 30Messages : 7

    Lun 8 Aoû 2016 - 19:50

    Merci beaucoup ! Bonne continuation :)
    Chaya Escanor
    Chaya Escanor
    FémininAge : 30Messages : 15

    Dim 14 Aoû 2016 - 2:19

    Merci ♥
    Kiki*
    Kiki*
    FémininAge : 27Messages : 32

    Lun 22 Aoû 2016 - 14:09

    MERCI
    FraiseChoco
    FraiseChoco
    FémininAge : 30Messages : 31

    Mer 24 Aoû 2016 - 6:09

    Merci :)
    MPGuenette
    MPGuenette
    FémininAge : 28Messages : 111

    Dim 4 Sep 2016 - 17:38

    merci !
    Vengryn
    Vengryn
    MasculinAge : 33Messages : 130

    Lun 19 Sep 2016 - 20:59

    Bonsoir :)

    Merci bien pour le travail, le rendu sur l'aperçu est bien sympathique.
    warning.sign
    warning.sign
    FémininAge : 33Messages : 58

    Lun 19 Sep 2016 - 21:29

    merci du partage ! ♥
    Edward Speleers
    Edward Speleers
    MasculinAge : 35Messages : 460

    Mar 20 Sep 2016 - 10:40

    Merci



    Catégories blanches et bleues avec avatar du dernier posteur - Page 10 Edkidd11
    Ifreann
    Ifreann
    FémininAge : 30Messages : 54

    Mer 21 Sep 2016 - 9:26

    Merci (encore, qu'est-ce que je ferais sans vous... xD)
    Kraken
    Kraken
    FémininAge : 31Messages : 137

    Sam 24 Sep 2016 - 19:17

    Merci pour le partage !
    Sherinn
    Sherinn
    FémininAge : 29Messages : 9

    Ven 30 Sep 2016 - 20:59

    merci !!
    Ombresia
    Ombresia
    FémininAge : 28Messages : 46

    Dim 9 Oct 2016 - 0:35

    Hey, merci !
    aminezz
    aminezz
    MasculinAge : 30Messages : 8

    Lun 10 Oct 2016 - 18:27

    merci :p
    Paulind
    Paulind
    FémininAge : 22Messages : 24

    Dim 30 Oct 2016 - 15:13

    Merci! :heart:
    Bryan1997
    Bryan1997
    MasculinAge : 26Messages : 51

    Jeu 3 Nov 2016 - 16:41

    merci :heart:
    Téoz
    Téoz
    FémininAge : 35Messages : 38

    Mer 9 Nov 2016 - 16:47

    merci
    wandererinfreedom
    wandererinfreedom
    FémininAge : 24Messages : 9

    Sam 12 Nov 2016 - 15:04

    merci !
    Alyssa.B50
    Alyssa.B50
    FémininAge : 29Messages : 42

    Mar 15 Nov 2016 - 22:04

    Merci beaucoup
    Vicko
    Vicko
    MasculinAge : 29Messages : 46

    Jeu 17 Nov 2016 - 4:32

    Merci
    Mr Kent
    Mr Kent
    MasculinAge : 29Messages : 23

    Sam 26 Nov 2016 - 2:54

    Merci beaucoup
    Géranium
    Géranium
    FémininAge : 23Messages : 56

    Mer 14 Déc 2016 - 15:23

    MERCI ! ♥♥
    xJokerxG
    xJokerxG
    MasculinAge : 29Messages : 12

    Mar 20 Déc 2016 - 3:27

    Merci beaucoup. ^^
    Omys
    Omys
    FémininAge : 29Messages : 63

    Mar 27 Déc 2016 - 12:08

    merci !
    Suika
    Suika
    FémininAge : 29Messages : 30

    Mar 27 Déc 2016 - 16:02

    merci! **
    Contenu sponsorisé


      La date/heure actuelle est Jeu 28 Mar 2024 - 21:58