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 du moment :
Coffret Collection Poster Pokémon EV8.5 ...
Voir le deal

    Liste des sujets originale

    Pochi
    Pochi
    FémininAge : 31Messages : 121

    Lun 9 Sep 2013 - 21:18

    Bonsoir, Bonjour, Bon appétit à Tous Very Happy

    Vous voulez que votre liste des sujets soit hypra classe ? *bim*

    Genre, comme ça ? Clique Ici

    Voilà comment tu dois faire :

    • Tout d'abord tu dois être fondateur du forum car nous allons toucher aux templates. Plus particulièrement à Topics_list_box. Mais pas que.

    Pour savoir comment faire, poste à la suite et ça apparaîtra comme par magie *-*


    Repère dans le template ceci :

    Code:
    <!-- END multi_selection -->
    Et

    Code:
    <!-- BEGIN multi_selection -->
          <td class="row2" align="center" valign="middle"><span class="postdetails"><input onclick="javascript:check_uncheck_main_{topics_list_box.row.BOX_ID}();" type="checkbox" name="{topics_list_box.FIELDNAME}[]{topics_list_box.row.BOX_ID}" value="{topics_list_box.row.FID}" {topics_list_box.row.L_SELECT} /></span></td>
       <!-- END multi_selection -->
    Supprime tout ce qu'il y a entre ces 2 balises.

    Ensuite, prends ce code et mets le à la place de ce que tu auras supprimé

    Code:
    <table class="forumline" width="800px" border="0" cellspacing="1" cellpadding="0" align="center">
       <tr>
              <th colspan="{topics_list_box.row.header_table.COLSPAN}" align="center" nowrap="nowrap" height="50px"></th>
          
          <!-- BEGIN multi_selection -->
          <th align="center" nowrap="nowrap" width="20" height="50px"><input onclick="check_uncheck_all_{topics_list_box.row.header_table.BOX_ID}();" type="checkbox" name="all_mark_{topics_list_box.row.header_table.BOX_ID}" value="0" /></th>
       <!-- END multi_selection -->
       </tr>
       <!-- BEGIN pagination -->
       <tr>
          <td class="row1" colspan="7" align="right"><span class="gensmall">{PAGINATION}</span></td>
       </tr>
       <!-- END pagination -->
       <!-- END header_table --><!-- BEGIN header_row -->
       <tr>
          <td class="row3" colspan="{topics_list_box.row.COLSPAN}"><span class="gensmall"> <b>{topics_list_box.row.L_TITLE}</b></span></td>
       </tr>
    <!-- END header_row -->

    <!-- BEGIN topic -->
    {topics_list_box.row.END_TABLE_STICKY}
       <tr>
          <!-- BEGIN single_selection -->
          <td class="{topics_list_box.row.ROW_CLASS}" align="center" valign="middle" width="20" bgcolor="#00EACB"><input type="radio" name="{topics_list_box.FIELDNAME}" value="{topics_list_box.row.FID}" {topics_list_box.row.L_SELECT} /></td>
          <!-- END single_selection -->
          <td class="{topics_list_box.row.ROW_FOLDER_CLASS}" align="center" valign="middle" width="20"><img title="{topics_list_box.row.L_TOPIC_FOLDER_ALT}" src="{topics_list_box.row.TOPIC_FOLDER_IMG}" alt="{topics_list_box.row.L_TOPIC_FOLDER_ALT}" /></td>
          <!-- BEGIN icon -->

          <!-- END icon -->
              <td class="{topics_list_box.row.ROW_CLASS}" onmouseover='this.className="row2"' onmouseout='this.className="{topics_list_box.row.ROW_CLASS}"' width="100%" ><div>
             <center><div class="topictitle">
                {topics_list_box.row.NEWEST_POST_IMG}{topics_list_box.row.PARTICIPATE_POST_IMG}{topics_list_box.row.TOPIC_TYPE}
                <h2 class="topic-title">
                                      <a class="topictitle" href="{topics_list_box.row.U_VIEW_TOPIC}">{topics_list_box.row.TOPIC_TITLE}</a> ○ <span class="topicauteur">Rédigé par {topics_list_box.row.TOPIC_AUTHOR}</span>
                </h2>
                              </div></center>

                      <div class="topicdescription">{topics_list_box.row.topic.switch_description.TOPIC_DESCRIPTION}</div>
                      
             
             <span class="gensmall">{topics_list_box.row.TOPIC_ANNOUNCES_DATES}{topics_list_box.row.TOPIC_CALENDAR_DATES}</span>&nbsp;
             <span class="gensmall">{topics_list_box.row.GOTO_PAGE}<!-- BEGIN nav_tree -->{topics_list_box.row.TOPIC_NAV_TREE} <!-- END nav_tree --></span>
          
    <div><img class="sujets" src="http://image.noelshack.com/fichiers/2013/37/1378742511-sujet.png"/></div>
                      
                <div class="reponseetvue"><span class="postdetails">A reçu {topics_list_box.row.REPLIES} réponses et a été lu {topics_list_box.row.VIEWS} fois.</span></div><div class="dernierereponse"><span class="postdetails">{topics_list_box.row.LAST_POST_TIME} • {topics_list_box.row.LAST_POST_AUTHOR} {topics_list_box.row.LAST_POST_IMG}</span></div></div></td>
    Et tu enregistres :) N'oublie pas de publier le template après !

    Ensuite, nous allons aller dans le template viewforum_body.

    Ici, c'est très simple :) Tu changes toutes les largeurs des balise

    Code:
    <table width="100%" ...
    En remplaçant le 100% par 800px.

    Puis tu enregistres et publies :)

    Et là, C'EST MOCHE O_O c'Normal, tu n'as que la structure de base :)

    Place ceci dans ton CSS :

    Code:
    /*liste des sujets*/

    .topictitle{
      align: center;
      valign: middle;
      font-family: Grand Hotel;
      font-size: 25px;
      color: #341100;
    }

    .topic-title{
      align: center;
      font-size: 11px;
    }

    .topicauteur{
      font-family: Arial;
    }

    .reponseetvue{
      position: absolute;
      float: left;
      font-family: Arial;
      color: #341100;
    }

    .dernierereponse{
      position: relative;
      float: right;
      font-family: Arial;
      color: #341100;
    }

    .sujets{
      position: absolute;
      align: center;
      margin-top: -12px;
      margin-left: 115px;
    }
    Tu valides et c'est bon !

    J'espère que ce petit Tuto/LS t'aura été utile pour faire un beau forum !

    N'oublie pas de créditer Pochi de NU :)


    PS : J'avais la flemme de faire une fiche pour proposer ce code Very Happy//PAN//
    PS2 : J'ai pas l'habitude de proposer des tutos, je donne plus souvent des LS, désolée si c'est nul xD

    Merci de laisser un message pour donner vos impressions, commentaires et/ou remerciements ^^
    Si vous avez des problèmes avec ce LS, venez poster ici.
    Ally Design
    Ally Design
    FémininAge : 27Messages : 57

    Jeu 12 Sep 2013 - 20:05

    Bah merci ^^
    Parking
    Parking
    FémininAge : 29Messages : 29

    Ven 20 Sep 2013 - 19:17

    Merci beaucoup pour ce partage ^^
    RozenBreizh
    RozenBreizh
    FémininAge : 33Messages : 1411

    Sam 21 Sep 2013 - 11:31

    Interessant, cela change de tous les autres codes. Merci de nous le proposer Very Happy
    Pomme-de-terre
    Pomme-de-terre
    FémininAge : 25Messages : 34

    Mer 25 Sep 2013 - 12:14

    Merci !
    Capouccino
    Capouccino
    FémininAge : 26Messages : 204

    Mer 25 Sep 2013 - 16:00

    Merci ^^



    "Espérer l'inespérable c'est croire en l'impossible."
    Prongs
    Prongs
    MasculinAge : 41Messages : 203

    Dim 29 Sep 2013 - 8:47

    Merci pour ce partage :love: 



    Liste des sujets originale Christ10 Liste des sujets originale Raph310
    TOM ELVIS JEDUSOR ~ JE SUIS VOLDEMORT
    Lord Voldemort est mon passé, mon présent & mon avenir

    Azuriel
    Azuriel
    FémininAge : 29Messages : 130

    Dim 20 Oct 2013 - 19:26

    Merci ^^
    Taoro
    Taoro
    MasculinAge : 31Messages : 78

    Sam 26 Oct 2013 - 20:56

    Merci Wink



    Nadia oupsss
    Nadia oupsss
    FémininAge : 38Messages : 13

    Dim 27 Oct 2013 - 19:26

    merci
    Mangockie
    Mangockie
    FémininAge : 26Messages : 40

    Mer 30 Oct 2013 - 11:59

    Aparecium !
    Vee
    Vee
    FémininAge : 25Messages : 24

    Jeu 31 Oct 2013 - 14:17

    Merci :)
    xToshi-Shûx
    xToshi-Shûx
    Autre / Ne pas divulguerAge : 33Messages : 39

    Sam 9 Nov 2013 - 13:08

    Merci du partage.



    Everdeen
    Everdeen
    FémininAge : 31Messages : 36

    Mar 12 Nov 2013 - 14:48

    Super, merci pour le tuto ♥



    Liste des sujets originale Anastasia
    Sparkman
    Sparkman
    MasculinAge : 28Messages : 5032

    Mar 12 Nov 2013 - 14:51

    Hey ! Merci du partage ! :)



    Liste des sujets originale 1474840621-sign
    Féli
    Féli
    FémininAge : 42Messages : 117

    Ven 29 Nov 2013 - 16:41

    merci



    Liste des sujets originale MtGPjQFSeHqzl1zoiU-5zwGCNig
    Little Ghost
    Little Ghost
    FémininAge : 34Messages : 91

    Jeu 5 Déc 2013 - 17:44

    merci =)
    BloodyMoony
    BloodyMoony
    FémininAge : 32Messages : 76

    Ven 6 Déc 2013 - 10:17

    C'est intéressant comme mise en forme Wink
    teck
    teck
    MasculinAge : 33Messages : 63

    Lun 9 Déc 2013 - 12:51

    justement je vais essayer ton code juste avant manger^^ en tout cas merci



    Liste des sujets originale Signa113
    tamanegeek
    tamanegeek
    MasculinAge : 25Messages : 167

    Mer 11 Déc 2013 - 15:16

    Merci !
    [W]endy
    [W]endy
    FémininAge : 34Messages : 117

    Sam 14 Déc 2013 - 21:09

    Merci (:
    Grande
    Grande
    FémininAge : 36Messages : 207

    Jeu 19 Déc 2013 - 18:30

    Merci
    hurudy
    hurudy
    MasculinAge : 44Messages : 40

    Dim 29 Déc 2013 - 22:09

    tip top :), merci
    Wizcoo
    Wizcoo
    MasculinAge : 31Messages : 34

    Dim 29 Déc 2013 - 22:31

    Merci
    pops44
    pops44
    MasculinAge : 31Messages : 28

    Mar 31 Déc 2013 - 14:32

    merci
    Contenu sponsorisé


      La date/heure actuelle est Jeu 12 Déc 2024 - 9:24