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 :
LEGO Icons 10331 – Le martin-pêcheur
35 €
Voir le deal

    (catinaphone) Modification d'un code pour catégorie

    Sury
    Sury
    FémininAge : 29Messages : 82

    Mar 18 Aoû 2015 - 0:49

    Bonjour (ou bonsoir) à vous tous !

    Je rencontre un problème avec le code des catégories sur le forum où je suis co-Administratrice. Nous avons sélectionné un code en libre-service, et nous voulions savoir s'il était possible de rajouter les sous-catégories dans la description de la catégorie, ainsi que l'avatar du dernier posteur à côté de son nom dans la colonne de droite.

    Désolée si je me suis mal exprimée, je n'y connais absolument rien en codage :ange:


    Donc voici le code :
    Code:
    <link href='http://fonts.googleapis.com/css?family=Covered+By+Your+Grace|Dancing+Script' rel='stylesheet' type='text/css' />
    <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 -->
    <!-- BEGIN tablehead -->
    <div class="cate_title">
      {catrow.tablehead.L_FORUM}
    </div>
    <div class="cate_bloc">
     <!-- END tablehead -->
     <!-- BEGIN cathead -->
     <!-- END cathead -->
     <!-- BEGIN forumrow -->
      <div class="cate_forum">
        <img class="old_new_lock" title="{catrow.forumrow.L_FORUM_FOLDER_ALT}" src="{catrow.forumrow.FORUM_FOLDER_IMG}" alt="{catrow.forumrow.L_FORUM_FOLDER_ALT}" />
        <div class="cate_forum_middle">
          <a class="forumlink" href="{catrow.forumrow.U_VIEWFORUM}">{catrow.forumrow.FORUM_NAME}</a>
          <div class="forum_desc">
            {catrow.forumrow.FORUM_DESC}
          </div>
        </div>
        <div class="cate_forum_last">
          <div class="forum_last_stats">
            Sujets:{catrow.forumrow.TOPICS} | Messages : {catrow.forumrow.POSTS}
          </div>
          <div class="forum_last_mess">
            {catrow.forumrow.LAST_POST}
          </div>
        </div>
      </div>
    <!-- END forumrow -->
    <!-- BEGIN catfoot -->
    <!-- END catfoot -->
    <!-- BEGIN tablefoot -->
    </div>
    <!-- END tablefoot -->
    <!-- END catrow -->



    Et voici le CSS :

    Code:
    /************************************************** DÉBUT DES CATÉGORIES **************************************************/

    /*Bloc des titres des catégories*/
    .cate_title {
      width: 800px;
      height: 75px;
      padding-top: 10px;
      margin: auto;
      text-align: center;
      background-image: url('http://img15.hostingpics.net/pics/520024nuage.png');
      background-repeat: no-repeat;
      background-position: top center;
      margin-bottom: -10px;
    }
    /*Titres des catégories*/
    .cate_title h2 {
      display: block;
      padding-top: 15px;
      height: 60px;
      margin: 0px;
      font-family: "Dancing Script";
      text-shadow: 1px 1px 3px #ffb5cc;
      font-size: 40px;
      letter-spacing: 1px;
      color: #d74e77;
    }
    .cate_title h2 img {
      margin-top: -25px;
      margin-left: 20px;
    }
    .cate_title h2 span {
      display: none;
    }
    a.nav img {
      display: none;
    }


    /*Bloc des catégories*/
    .cate_bloc {
      background-color: #ffffff;
      width: 800px;
      margin: auto;
      margin-bottom: 10px;
      border-radius: 10px;
      padding-top: 50px;
      padding-bottom: 1px;
      font-family: "abeatbykai", sans-serif;
      font-size: 12px;
      letter-spacing: 1px;
      color: gray;
    }


    /*Bloc des forums*/
    .cate_forum {
      height: 100px;
      width: 800px;
      margin-bottom: 20px;
    }


    /*Image Old New Lock*/
    .old_new_lock {
      float: left;
      margin-left: 15px;
      margin-top: 21px;
      width: 130px; /*Largeur des images*/
      height: 57px; /*Hauteur des images*/
    }
    /*Masque*/
    .old_new_lock {
      -webkit-mask: url(http://www.aht.li/2552618/nuage.svg) center center / 130px 57px;
      mask: url(http://www.aht.li/2552618/nuage.svg) center center / 130px 57px;
    }


    /*Bloc gris du mileu*/
    .cate_forum_middle {
      position: relative;
      float: left;
      margin-top: 10px;
      margin-left: 15px;
      margin-right: 15px;
      width: 420px;
      height: 53px;
      padding: 10px;
      padding-top: 17px;
      background-color: #fafafa;
      border-radius: 10px;
    }

    /*Titres des forums*/
    .forumlink {
      position: absolute;
      top: -20px;
      z-index: 2;
      height: 28px;
      font-size: 28px;
      font-family: 'Satisfy', cursive;
      color: grey!important;
      font-weight: normal;
    }
    /*Titres survolés des forums*/
    .forumlink:hover {
      color: #d74e77!important;
      text-decoration: none!important;
    }
    /*Désactiver les images des titres*/
    .forumlink img {
      display: none;
    }

    /*Description des forums*/
    .forum_desc {
      height: 53px;
      overflow-y: auto;
      padding-right: 5px;
      text-align: justify;
    }


    /*Bloc gris des statistiques et du dernier message*/
    .cate_forum_last {
      position: relative;
      float: left;
      margin-top: 10px;
      width: 160px;
      height: 70px;
      padding: 5px;
      background-color: #fafafa;
      border-radius: 10px;
      text-align: center;
    }
    /*Statistiques*/
    .forum_last_stats {
      margin-left: 3px;
      margin-right: 3px;
      margin-bottom: 10px;
      padding-bottom: 3px;
      font-size: 9px;
      border-bottom: 1px dashed #d74e77;
    }
    /*Police du dernier message*/
    .forum_last_mess, .forum_last_mess a.gensmall {
      font-size: 11px;
      font-family: "abeatbykai", sans-serif;
    }
    /*Couleur des liens du dernier message*/
    .forum_last_mess a {
      color: #d74e77;
    }


    /*Les barres de défilement dans les catégories*/
    .forum_desc::-webkit-scrollbar {height:12px; width:5px; background:none; margin-right:5px;}
    .forum_desc::-webkit-scrollbar-thumb {background:rgba(242,163,189,1); height:30px; border-radius:30px;}
    .forum_desc::-webkit-scrollbar-corner {background:none;}

    /************************************************** FIN


    Voilà, j'espère avoir réussit à me faire comprendre ! Si ce n'est pas le cas n'hésitez pas à me poser des questions à la suite de ce message, j'essayerai d'y répondre au mieux !

    Merci à tous :bisou:
    Neva
    Neva
    FémininAge : 33Messages : 18565

    Jeu 20 Aoû 2015 - 21:35

    Salut,

    Ce que tu demandes tiens plus de la personnalisation que d'un problème donc je déplace dans la bonne section :)



     
    Sury
    Sury
    FémininAge : 29Messages : 82

    Ven 21 Aoû 2015 - 23:36

    Ah d'accord, désolée, et merci :)
    Sury
    Sury
    FémininAge : 29Messages : 82

    Lun 24 Aoû 2015 - 15:55

    UP
    Sury
    Sury
    FémininAge : 29Messages : 82

    Jeu 27 Aoû 2015 - 23:24

    Toujours d'actualité.
    catinaphone
    catinaphone
    FémininAge : 32Messages : 93

    Ven 28 Aoû 2015 - 17:21

    Coucou ! Very Happy

    J'ai ajouté les modifications que tu souhaitais, mais en l'absence d'informations très précises, j'ai fait un peu à ma sauce : (catinaphone) Modification d'un code pour catégorie Mini_197271modiifcode

    Est-ce que ça te convient comme ça ou est-ce que tu veux que je modifie quelque chose ?


    Dernière édition par catinaphone le Dim 30 Aoû 2015 - 9:05, édité 1 fois
    Sury
    Sury
    FémininAge : 29Messages : 82

    Sam 29 Aoû 2015 - 20:51

    C'est parfait merci beaucoup !!!!! :hug: cheers
    catinaphone
    catinaphone
    FémininAge : 32Messages : 93

    Dim 30 Aoû 2015 - 9:22

    De rien ! :gentleman:

    Voilà le template :
    Code:
    <link href='http://fonts.googleapis.com/css?family=Covered+By+Your+Grace|Dancing+Script' rel='stylesheet' type='text/css' />
    <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 -->
    <!-- BEGIN tablehead -->
    <div class="cate_title">
      {catrow.tablehead.L_FORUM}
    </div>
    <div class="cate_bloc">
     <!-- END tablehead -->
     <!-- BEGIN cathead -->
     <!-- END cathead -->
     <!-- BEGIN forumrow -->
      <div class="cate_forum">
        <img class="old_new_lock" title="{catrow.forumrow.L_FORUM_FOLDER_ALT}" src="{catrow.forumrow.FORUM_FOLDER_IMG}" alt="{catrow.forumrow.L_FORUM_FOLDER_ALT}" />
        <div class="cate_forum_middle">
          <a class="forumlink" href="{catrow.forumrow.U_VIEWFORUM}">{catrow.forumrow.FORUM_NAME}</a>
          <div class="forum_desc">
            {catrow.forumrow.FORUM_DESC}
          </div>
            <div class="sousforums">
                            {catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}
                      </div>
        </div>
        <div class="cate_forum_last">
          <div class="forum_last_stats">
            Sujets:{catrow.forumrow.TOPICS} | Messages : {catrow.forumrow.POSTS}
          </div>
          <div class="forum_last_mess"><div class="lastpost-avatar"><!-- BEGIN avatar -->{catrow.forumrow.avatar.LAST_POST_AVATAR}<!-- END avatar --></div>
            {catrow.forumrow.LAST_POST}      </div>
                </div>
      </div>
    <!-- END forumrow -->
    <!-- BEGIN catfoot -->
    <!-- END catfoot -->
    <!-- BEGIN tablefoot -->
    </div>
    <!-- END tablefoot -->
    <!-- END catrow -->

    Le CSS :
    Code:
    /************************************************** DÉBUT DES CATÉGORIES **************************************************/

    /*Bloc des titres des catégories*/
    .cate_title {
      width: 800px;
      height: 75px;
      padding-top: 10px;
      margin: auto;
      text-align: center;
      background-image: url('http://img15.hostingpics.net/pics/520024nuage.png');
      background-repeat: no-repeat;
      background-position: top center;
      margin-bottom: -10px;
    }
    /*Titres des catégories*/
    .cate_title h2 {
      display: block;
      padding-top: 15px;
      height: 60px;
      margin: 0px;
      font-family: "Dancing Script";
      text-shadow: 1px 1px 3px #ffb5cc;
      font-size: 40px;
      letter-spacing: 1px;
      color: #d74e77;
    }
    .cate_title h2 img {
      margin-top: -25px;
      margin-left: 20px;
    }
    .cate_title h2 span {
      display: none;
    }
    a.nav img {
      display: none;
    }


    /*Bloc des catégories*/
    .cate_bloc {
      background-color: #ffffff;
      width: 800px;
      margin: auto;
      margin-bottom: 10px;
      border-radius: 10px;
      padding-top: 50px;
      padding-bottom: 1px;
      font-family: "abeatbykai", sans-serif;
      font-size: 12px;
      letter-spacing: 1px;
      color: gray;
    }


    /*Bloc des forums*/
    .cate_forum {
      height: 100px;
      width: 800px;
      margin-bottom: 20px;
    }


    /*Image Old New Lock*/
    .old_new_lock {
      float: left;
      margin-left: 15px;
      margin-top: 21px;
      width: 130px; /*Largeur des images*/
      height: 57px; /*Hauteur des images*/
    }
    /*Masque*/
    .old_new_lock {
      -webkit-mask: url(http://www.aht.li/2552618/nuage.svg) center center / 130px 57px;
      mask: url(http://www.aht.li/2552618/nuage.svg) center center / 130px 57px;
    }


    /*Bloc gris du mileu*/
    .cate_forum_middle {
      position: relative;
      float: left;
      margin-top: 10px;
      margin-left: 15px;
      margin-right: 15px;
      width: 420px;
      height: 53px;
      padding: 10px;
      padding-top: 17px;
      background-color: #fafafa;
      border-radius: 10px;
    }

    /*Titres des forums*/
    .forumlink {
      position: absolute;
      top: -20px;
      z-index: 2;
      height: 28px;
      font-size: 28px;
      font-family: 'Satisfy', cursive;
      color: grey!important;
      font-weight: normal;
    }
    /*Titres survolés des forums*/
    .forumlink:hover {
      color: #d74e77!important;
      text-decoration: none!important;
    }
    /*Désactiver les images des titres*/
    .forumlink img {
      display: none;
    }

    /*Description des forums*/
    .forum_desc {
      height: 53px;
      overflow-y: auto;
      padding-right: 5px;
      text-align: justify;
    }

    /*liens de sous forums*/
    .sousforums {
      padding: 2px;
      text-align: center;
    }

    .sousforums a {
      color: #000000;
      padding: 2px;
      font-family: "abeatbykai", sans-serif;
      font-size: 11px;
    }

    /*Bloc gris des statistiques et du dernier message*/
    .cate_forum_last {
      position: relative;
      float: left;
      margin-top: 10px;
      width: 160px;
      height: 70px;
      padding: 5px;
      background-color: #fafafa;
      border-radius: 10px;
      text-align: center;
    }
    /*Statistiques*/
    .forum_last_stats {
      margin-left: 3px;
      margin-right: 3px;
      margin-bottom: 10px;
      padding-bottom: 3px;
      font-size: 9px;
      border-bottom: 1px dashed #d74e77;
    }
    /*Police du dernier message*/
    .forum_last_mess, .forum_last_mess a.gensmall {
      font-size: 11px;
      font-family: "abeatbykai", sans-serif;
    }
    /*Couleur des liens du dernier message*/
    .forum_last_mess a {
      color: #d74e77;
    }
    /*Avatar du dernier posteur*/
    .lastpost-avatar {
      float: left;
      width: 40px;
      height: 40px;
    }

    /*Les barres de défilement dans les catégories*/
    .forum_desc::-webkit-scrollbar {height:12px; width:5px; background:none; margin-right:5px;}
    .forum_desc::-webkit-scrollbar-thumb {background:rgba(242,163,189,1); height:30px; border-radius:30px;}
    .forum_desc::-webkit-scrollbar-corner {background:none;}

    /************************************************** FIN

    /* -------------------------------- QEEL -------------------------------- */

            /*** MISE EN FORME LIENS AU SURVOL ***/
            a:hover {
              text-decoration: none !important;
            }

            /*** MISE EN FORME FONT DU QEEL ***/
            .fond_qeel {
              width: 780px;
              border-radius: 0px 0px 25px 25px;
              background-color: #E4E4E4;
              margin: auto;
              height: 620px;
              position: relative;
            }

            /*** MISE EN FORME TITRE PRINCIPAL ***/
            .titre_principal {
              color: #2D5A57;
              font-family: georgia;
              font-size: 28;
              letter-spacing: 5px;
              text-align: center;
            }

            /*** MISE EN FORME SOUS-TITRE "Et à qui se fier ?" ***/
            .titre_secondaire {
              color: #C7BBC1;
              font-family: georgia;
              font-size: 14px;
              text-align: center;
            }

            /*** MISE EN FORME BLOC STATISTIQUES ***/
            .bloc_stat {
              background-color: #F0F0F0;
              padding: 15px;
              width: 200px;
              height: 150px;
              overflow: auto;
              font-size: 11px;
              border: 2px solid #CACACA;
              text-align: justify;
              color: #515151;
              position: absolute;
              left: 3em;
              z-index: 1;
            }

            /*** MISE EN FORME BLOC DES GROUPES ***/
            .bloc_groupes {
              background-color: #F0F0F0;
              padding: 15px;
              width: 420px;
              height: 50px;
              overflow: auto;
              font-size: 20px;
              border: 2px solid #CACACA;
              text-align: center;
              font-family: 'Six Caps', sans-serif;
              position: absolute;
              left: 14.5em;
              z-index: 1;
            }

            /*** MISE EN FORME BLOC DES CONNECTES LES 24H ***/
            .bloc_connectes {
              background-color: #F0F0F0;
              padding: 15px;
              width: 420px;
              height: 50px;
              overflow: auto;
              font-size: 20px;
              border: 2px solid #CACACA;
              text-align: center;
              font-family: 'Six Caps', sans-serif;
              position: absolute;
              left: 14.5em;
              z-index: 1;
            }

            /*** COULEUR ET TRANSPARENCE DU FOND DES 24H ***/
            #kaboum .row1 {
              background-color : transparent;
            }

            #kaboum span.gensmall {
              color: #515151;
            }

            /*** MISE EN FORME DES TITRES (simple + survol) ***/
            .titre_bloc {
              font-family: 'Dancing Script', cursive;
              font-size: 24px;
              font-weight: bold;
              color: #B0C3AB;
              position: absolute;
              z-index: 2;
              margin-top: -18px;
            }

            .titre_bloc:hover {
              color: #2D5A57;
            }

            /*** GROUPES A ONGLETS ***/
            /* Mise en forme des noms de groupe */
            .groupe_onglet {
              display: inline-block;
              padding: 10px;
            }

            /* Mise en forme du bloc en transparence de description */
            .contenu_groupe_onglet {
              padding: 15px;
              display: none;
              width: 315px;
              height: 115px;
              overflow: auto;
              font-size: 11px;
              color: #414141;
              text-align: justify;
              background-color: #CBC4C2;
              position: absolute;
              top: 14em;
              left: 21em;
              filter: alpha(opacity = 50);
              opacity: 0.5;
            }

            /* Mise en forme des liens */
            .contenu_groupe_onglet a{
              text-decoration: none !important;
            }

            /*** MISE EN FORME DES CREDITS ***/
            .credits {
              text-align: right;
              margin-right: 10px;
              font-size: 9px;
              margin-top: 10px;
            }

            .credits a{
              color: #B0C3AB;
            }

            /* -------------------------------- FIN QEEL -------------------------------- */
    Sury
    Sury
    FémininAge : 29Messages : 82

    Dim 30 Aoû 2015 - 17:11

    Merci beaucoup ! C'est super merci ! :)
    Contenu sponsorisé


      La date/heure actuelle est Ven 22 Nov 2024 - 23:30