AccueilFAQRechercherMembresGroupesS'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.


    Catégories en tableaux couleur pêche

    Cheshire Cat
    Cheshire Cat
    FémininAge : 21Messages : 999

    le Dim 6 Mar 2016 - 13:17

    Rappel du premier message :



    Bonjour à vous ! 

    Voici mon second LS sur Never Utopia, on applaudit o/

    Ceci est donc un libre service de catégorie réalisé à la demande d'Amacky qui a fait le schéma et proposé la palette de couleurs.

    Un petit aperçu ici WWW

    > Afin d'avoir la bonne structure pour vos catégories
    PA > Affichage > Page d'accueil > Structure et hiérarchie > Conserver les catégories sur l'index > Moyen

    > La largeur des catégories est de 800px

    > Les dimensions des images new / old / lock sont de 57*100

    > Vous devez activer l'affichage des sous-forums si ce n'est pas déjà fait.
    PA > Affichage > Page d'accueil > Structure et hiérarchie > Lien vers les niveaux inférieurs ("oui" ou alors "avec image" -vous avez un exemple sur NU)

    > Pour régler le dernier message affiché:
    PA > Affichage > Page d'accueil > Structure et hiérarchie
    Vous devez cocher Oui pour Afficher le titre du sujet du dernier message d'un forum sur l'index
    La longueur du titre du sujet affiché doit être de 16.

    > Pour afficher l'avatar du dernier posteur :
    PA > Affichage > Page d'accueil > Structure et hiérarchie > Afficher les avatars dans la colonne "derniers messages" > Oui

    1. Ajouter les polices personnalisées. Il va falloir faire PA > Accueil > Affichage > Templates > Général > overall_header 
    Cette ligne, on va l'ajouter après la 3e ligne !
    Code:
    <link href='https://fonts.googleapis.com/css?family=Open+Sans|Voltaire|Handlee'rel='stylesheet' type='text/css'>

    On enregistre et on oublie pas d'activer la template !

    2. Puis on va aller dans index_box
    Pas besoin d'explications compliquées. On supprime le template de base et on le remplace par ce code là
    Code:
    <table width="100%" border="0" cellspacing="1" cellpadding="0" align="center">
     <tr>
     <td valign="bottom">
                      <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>
    <div class="modifcat">
    <!-- BEGIN catrow --><table class="forumline" width="100%" border="0" cellspacing="1" cellpadding="0">
     <!-- BEGIN cathead -->
     <tr>
     <!-- BEGIN inc -->
     <td class="{catrow.cathead.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" /></td>
     <!-- END inc -->
     <td colspan="{catrow.cathead.INC_SPAN}" width="100%">
     <div class="cattitre">{catrow.cathead.CAT_TITLE}</div>
     </td>
     </tr>
     <!-- END cathead -->
     <!-- BEGIN forumrow -->
     <tr>
     <!-- BEGIN inc -->
     <td width="46"><img src="{SPACER}" height="0" width="46" alt="." /></td>
     <!-- END inc -->
     <td>
                      <div class="imgmess">
                        <img title="{catrow.forumrow.L_FORUM_FOLDER_ALT}" src="{catrow.forumrow.FORUM_FOLDER_IMG}" alt="{catrow.forumrow.L_FORUM_FOLDER_ALT}" />
                      </div>
               </td>
                      <h1 class="forumlink">
                        <a class="forumlink" href="{catrow.forumrow.U_VIEWFORUM}">{catrow.forumrow.FORUM_NAME}</a><br />
                </h1>
               <td>
     <div class="liensfrm">
                              {catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}
                            </div>
               </td>
             <td class="row1 over" colspan="{catrow.forumrow.INC_SPAN}" valign="top" width="100%">
                      <div class="descfrm">{catrow.forumrow.FORUM_DESC}</div>
             </td>
                       <td class="row3 over" align="center" valign="middle">
                         <div class="avatarfrm">
                         <!-- BEGIN avatar -->
                           {catrow.forumrow.avatar.LAST_POST_AVATAR}
                      <!-- END avatar -->
                         </div>
                       </td>
               <td class="row3" align="center" valign="middle">
                      <div class="derniermess">
                        {catrow.forumrow.POSTS} messages dans {catrow.forumrow.TOPICS} sujets<br />
                        {catrow.forumrow.LAST_POST}
                      </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></div><img src="{SPACER}" alt="" height="5" width="1" /><!-- END tablefoot --><!-- END catrow -->

    Puis on enregistre et on valide !

    3. Maintenant, place au CSS ! On va faire Affichage > Couleurs > Feuille de style CSS et on ajoute le code qui suit et on valide notre CSS.

    Code:
    /*Catégories par Cheshire Cat*/
    .modifcat{
      margin-top:10px;
      background-color:#f4f0e5;
    }
    .forumline{
      width:800px;
      margin:auto;
    }
    .cattitre{
      width:746px;
      text-align:center;
      margin-top:20px;
      margin-bottom:10px;
      margin-left:25px;
      margin-right:25px;
      padding-top:5px;
      font-size:35px;
      min-height:50px;
      color:#ffffff !important;
      background-color:#d9b698;
      font-family: 'Handlee', cursive;
    }
    .forumlink{
      letter-spacing:7px;
      font-size:20px;
      text-decoration:none;
      text-align:center;
      color:#c36e6e !important;
      font-family: 'Voltaire', sans-serif;
      transition:all ease 0.7s;
      -webkit-transition:all ease 0.7s;
    }
    .forumlink:hover{
      transition:all ease 0.7s;
      -webkit-transition:all ease 0.7s;
      text-decoration:none !important;
      color:#3D2617 !important;
    }
    .imgmess{
      position:relative;
      width:57px;
      height:100px !important;
      background-color:#d9b698;
      margin-right:10px;
      margin-bottom:15px;
      margin-left:25px;
      padding:5px;
    }
    .imgmess img{
      height:100px;
    }
    .liensfrm{
      overflow:auto;
      font-size:0px;
      width:130px;
      height:110px;
      background-color:#d9b698;
      bottom:-50px;
      margin-right:5px;
      margin-bottom:15px;
    }
    .liensfrm a{
      letter-spacing:2px;
      font-family: 'Voltaire', sans-serif;
      display:block;
      font-size:13px;
      max-width:130px;
      color:#c36e6e;
      background-color:#ffffff;
      border-bottom:3px solid #794a2f;
      text-align:center;
      text-decoration:none;
      transition:all ease 0.7s;
      -webkit-transition:all ease 0.7s;
    }
    .liensfrm a:hover{
      color:#ffffff !important;
      background-color:#c36e6e;
      text-decoration:none !important;
      transition:all ease 0.7s;
      -webkit-transition:all ease 0.7s;
    }
    .descfrm{
      position:absolute;
      margin:auto;
      width:310px;
      height:90px;
      font-size:11px;
      background-color:#d9b698;
      overflow:auto;
      margin-bottom:15px;
      margin-left:2px;
      text-align:justify;
      padding:10px;
      color:#000000;
      font-family: 'Open Sans', sans-serif;
    }
    .avatarfrm{
      overflow:hidden;
      width:57px;
      height:100px;
      background-color:#d9b698;
      padding:5px;
      margin-bottom:15px;
    }
    .avatarfrm img{
      height:100px;
    }
    .derniermess{
      position:relative;
      width:96px;
      height:100px;
      font-size:10px;
      background-color:#d9b698;
      margin-left:5px;
      margin-bottom:15px;
      margin-right:25px;
      padding-left:5px;
      padding-right:5px;
      padding-top:10px;
      color:#000000;
      font-family: 'Open Sans', sans-serif;
    }
    .derniermess a{
      color:#c36e6e;
      text-decoration:none;
      transition:all ease 0.7s;
      -webkit-transition:all ease 0.7s;
    }
    .derniermess a:hover{
      color:#3D2617;
      transition:all ease 0.7s;
      -webkit-transition:all ease 0.7s;
      text-decoration:none !important;
    }
    /*Fin des catégories*/

    Un petit merci ou commentaire est toujours le bienvenu ^^
    - Mettre/laisser un crédit vers Never-Utopia est obligatoire.
    - Si vous avez des problèmes avec ce LS ou des questions, venez poster ici.


    Dernière édition par Cheshire Cat le Mar 12 Sep 2017 - 20:40, édité 1 fois
    Kuvera
    Kuvera
    FémininAge : 25Messages : 34

    le Dim 25 Juin 2017 - 4:28

    Merci
    Hyuna
    Hyuna
    FémininAge : 22Messages : 98

    le Mer 28 Juin 2017 - 18:39

    Thanks' ♥
    LESIO
    LESIO
    MasculinAge : 21Messages : 10

    le Dim 9 Juil 2017 - 2:02

    Merci
    Malizia.
    Malizia.
    FémininAge : 23Messages : 90

    le Lun 10 Juil 2017 - 4:15

    Merci!
    Kaushui
    Kaushui
    FémininAge : 20Messages : 19

    le Mer 12 Juil 2017 - 19:02

    Merci ! C'est quelque chose dans ce style que je cherche à faire :o
    Lalia
    Lalia
    FémininAge : 19Messages : 44

    le Lun 24 Juil 2017 - 21:51

    Merci x3
    Tifastrife
    Tifastrife
    FémininAge : 26Messages : 259

    le Mar 25 Juil 2017 - 16:19

    J'aime beaucoup ! Very Happy



    Les êtres chèrs que nous avons perdus, et les rêves, qui se sont envolés... Ne les oubliez jamais...

    Catégories en tableaux couleur pêche - Page 10 090911064129411932
    Silver Blast
    Silver Blast
    MasculinAge : 19Messages : 74

    le Mer 26 Juil 2017 - 14:38

    Merci ! :)
    Anonymous
    Invité

    le Jeu 27 Juil 2017 - 10:54

    Merci pour le partage :)
    Sadie White
    Sadie White
    FémininAge : 28Messages : 36

    le Ven 28 Juil 2017 - 14:58

    Merci =)
    NekoMiaouw
    NekoMiaouw
    FémininAge : 22Messages : 136

    le Dim 20 Aoû 2017 - 16:09

    Aller, j'essai ça ! merci :)



    Catégories en tableaux couleur pêche - Page 10 388245alisign
    didicmy
    didicmy
    FémininAge : 28Messages : 69

    le Lun 21 Aoû 2017 - 0:06

    C'est super merci pour le partage
    Jessabelle
    Jessabelle
    FémininAge : 25Messages : 110

    le Mer 6 Sep 2017 - 2:00

    C'est superbe, merci du partage :)
    Selmacke
    Selmacke
    FémininAge : 29Messages : 100

    le Sam 9 Sep 2017 - 10:38

    Merci :)
    KannaFantasy
    KannaFantasy
    FémininAge : 26Messages : 24

    le Sam 9 Sep 2017 - 21:01

    Haaaaa j'aime trop merci Very Happy
    missnothing21
    missnothing21
    FémininAge : 26Messages : 29

    le Sam 9 Sep 2017 - 22:54

    Merciii
    Ayfoth
    Ayfoth
    MasculinAge : 29Messages : 1277

    le Lun 16 Oct 2017 - 8:42

    Merci pour ces codes :)



    Catégories en tableaux couleur pêche - Page 10 Oyl7
    Elijahm
    Elijahm
    MasculinAge : 34Messages : 7

    le Lun 23 Oct 2017 - 18:26

    ENORME MERCI.
    QUE DIEU TE BENISSE.
    Sow_Oxalys
    Sow_Oxalys
    FémininAge : 28Messages : 21

    le Mar 24 Oct 2017 - 22:17

    merci beaucoup !
    Nalex
    Nalex
    FémininAge : 29Messages : 154

    le Ven 27 Oct 2017 - 15:28

    merci!



    Catégories en tableaux couleur pêche - Page 10 567962k6yx
    maaelstrom
    maaelstrom
    FémininAge : 26Messages : 70

    le Jeu 9 Nov 2017 - 21:59

    Merci pour ton travail, c'est super joli :heart:





    you get so alone at the times that it just makes sense.
    Chocolou
    Chocolou
    FémininAge : 25Messages : 125

    le Mer 14 Fév 2018 - 0:08

    Merciiiii c'est juste trop beau 8D
    Lazulijune
    Lazulijune
    FémininAge : 21Messages : 14

    le Dim 29 Avr 2018 - 21:15

    Merci <3
    DevDev
    DevDev
    FémininAge : 26Messages : 16

    le Dim 23 Sep 2018 - 13:59

    Merci pour le partage :)
    Litalis
    Litalis
    MasculinAge : 23Messages : 27

    le Mer 8 Mai 2019 - 20:50

    Merci !
    Contenu sponsorisé


      La date/heure actuelle est Mar 23 Juil 2019 - 14:00