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 à ne pas rater :
Manga Chainsaw Man : où acheter le Tome 17 édition Collector de ...
19.99 €
Voir le deal

    Catégories en tableaux couleur pêche

    Cheshire Cat
    Cheshire Cat
    FémininAge : 26Messages : 975

    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
    Borée
    Borée
    MasculinAge : 24Messages : 56

    Mer 14 Déc 2016 - 0:18

    Merci beaucoup pour le code!!
    Rosedesvents
    Rosedesvents
    FémininAge : 37Messages : 97

    Mer 14 Déc 2016 - 12:27

    Merci pour le partage :)
    Pauli
    Pauli
    FémininAge : 30Messages : 22

    Dim 18 Déc 2016 - 17:59

    Merci beaucoup pour le partage c'est hyper généreux
    PockyBanana
    PockyBanana
    FémininAge : 34Messages : 36

    Dim 18 Déc 2016 - 21:52

    C'est super joli ! Merci beaucoup pour le partage ! o/
    vaness123
    vaness123
    FémininAge : 32Messages : 12

    Lun 19 Déc 2016 - 18:00

    Merci :)
    xJokerxG
    xJokerxG
    MasculinAge : 29Messages : 12

    Lun 19 Déc 2016 - 23:28

    Merci beaucoup. ^^
    Whisperinette
    Whisperinette
    FémininAge : 31Messages : 22

    Ven 23 Déc 2016 - 22:52

    Merci beaucoup ! C'est très joli, sobre et parfait ! :hug2: :hudada: :pompom:
    Lazulijune
    Lazulijune
    FémininAge : 25Messages : 14

    Sam 24 Déc 2016 - 1:50

    Merci ~
    Nono-Chan
    Nono-Chan
    FémininAge : 26Messages : 273

    Sam 24 Déc 2016 - 16:37

    superbe !
    mon-etoile
    mon-etoile
    FémininAge : 35Messages : 140

    Lun 26 Déc 2016 - 9:17

    Merci
    ixraider158963
    ixraider158963
    MasculinAge : 23Messages : 6

    Sam 7 Jan 2017 - 13:56

    J'adore
    murphy__s
    murphy__s
    MasculinAge : 34Messages : 33

    Sam 7 Jan 2017 - 17:28

    J'aime beaucoup merci
    Shupy
    Shupy
    FémininAge : 28Messages : 15

    Mar 10 Jan 2017 - 18:40

    Merci !
    Nighthayah
    Nighthayah
    FémininAge : 36Messages : 69

    Ven 13 Jan 2017 - 17:30

    Mille merci
    Hylia
    Hylia
    FémininAge : 23Messages : 100

    Dim 15 Jan 2017 - 18:26

    Merci!



    Catégories en tableaux couleur pêche - Page 7 _hylia10
    Kinst.MP
    Kinst.MP
    FémininAge : 25Messages : 53

    Lun 16 Jan 2017 - 11:41

    Simple et efficace! o/ Merci! *^* ~
    avatar
    Wolftactick
    FémininAge : 22Messages : 71

    Dim 22 Jan 2017 - 12:30

    Merci c'est trop beau !
    mijako
    mijako
    FémininAge : 31Messages : 83

    Dim 22 Jan 2017 - 16:40

    merci ;;
    sturdya
    sturdya
    FémininAge : 25Messages : 34

    Lun 6 Fév 2017 - 23:17

    merci
    Moona Neko
    Moona Neko
    FémininAge : 29Messages : 75

    Ven 10 Fév 2017 - 14:45

    Merci !
    Envola
    Envola
    FémininAge : 32Messages : 63

    Lun 13 Fév 2017 - 22:37

    Merci !
    Momiji-chan
    Momiji-chan
    FémininAge : 25Messages : 38

    Lun 20 Fév 2017 - 12:07

    Hello.
    Un grand merci pour ces codes Wink
    ROGERS.
    ROGERS.
    FémininAge : 29Messages : 335

    Mer 22 Fév 2017 - 15:03

    J'aime beaucoup, merci pour le partage ♥
    defenrir
    defenrir
    MasculinAge : 41Messages : 105

    Sam 25 Fév 2017 - 18:32

    merci =)
    br4nd0n
    br4nd0n
    Age : 30Messages : 50

    Dim 26 Fév 2017 - 20:35

    Très beau merci :)



    Catégories en tableaux couleur pêche - Page 7 Pourbrandonob6
    Kit by Adil94
    Contenu sponsorisé


      La date/heure actuelle est Jeu 28 Mar 2024 - 15:49