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 avec forums type bandeau

    Partagez
    avatar
    Sauney
    FémininAge : 23Messages : 428

    le Lun 14 Juil 2014 - 16:50

    Rappel du premier message :



    Voici un aperçu !
    Spoiler:

    Voilà le HTML, il suffit de remplacer votre template index_box par le code ci-dessous :
    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 --><!-- BEGIN tablehead --><div class="cadre_categorie">
    <div class="categorie_titre_bloc"><span class="categorie_titre">{catrow.tablehead.L_FORUM}</span></div>
       <!-- END tablehead -->
       <!-- BEGIN cathead -->
       <!-- END cathead -->
       <!-- BEGIN forumrow -->
    <div class="forum"><div class="titre_forum" colspan="{catrow.forumrow.INC_SPAN}">
             <h{catrow.forumrow.LEVEL} class="hierarchy">
                <span class="forumlink">
                   <a class="forumlink" href="{catrow.forumrow.U_VIEWFORUM}">{catrow.forumrow.FORUM_NAME}</a><br />
                </span>
                              <span id="stats_forum" class="gensmall">{catrow.forumrow.TOPICS} S | {catrow.forumrow.POSTS} M</span>
             </h{catrow.forumrow.LEVEL}>
              </div>
    <div class="description_forum"><span class="genmed">{catrow.forumrow.FORUM_DESC}</span>
             <span class="gensmall">
                <!-- BEGIN switch_moderators_links -->
                {catrow.forumrow.switch_moderators_links.L_MODERATOR}{catrow.forumrow.switch_moderators_links.MODERATORS}
                <!-- END switch_moderators_links -->
             </span>
          </div>
      <div class="icones_messages">
       <img title="{catrow.forumrow.L_FORUM_FOLDER_ALT}" src="{catrow.forumrow.FORUM_FOLDER_IMG}" alt="{catrow.forumrow.L_FORUM_FOLDER_ALT}" />
      </div>
      <div class="dernier_message"><br /><br /><span class="gensmall">{catrow.forumrow.LAST_POST}</span>
          </div>
    <div class="sous_forums">
      {catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}
      </div></div>
       <!-- END forumrow -->
       <!-- BEGIN catfoot -->
       <!-- END catfoot -->
       <!-- BEGIN tablefoot -->
    <center><a class="credits" href="http://www.never-utopia.com/">Sauney de Never Utopia</a></center></div><!-- END tablefoot --><!-- END catrow -->

    Voici pour le CSS à placer dans la feuille de style, le CSS n'est pas commenté mais je pense qu'il parle de lui-même :
    Code:
    /* DEBUT DES CATEGORIES */
    .cadre_categorie{
    margin: 10px auto 10px auto;
    width: 90%;
    border-radius: 20px;
    border: 1px solid #000;
    box-shadow: 0px 0px 2px grey;
    }
    .categorie_titre_bloc{
    width: 100%;
    height: 40px;
    border-bottom: 5px dotted #000; 
    }
    .categorie_titre, .categorie_titre h2{
    text-align: center;
    font-family: 'Georgia';
    font-size: 40px;
    color: #000;
    }
    .forum{
    width: 100%;
    margin: auto;
    }
    .titre_forum{
    background-color: #000;
    width: 99%;
    height: 30px;
    padding: 5px;
    }
    .forumlink, a.forumlink, a.forumlink:visited, a.forumlink:active{
    display: inline-block;
    text-align: left;
    font-weight: bold;
    font-size: 25px;
    font-family: 'Georgia';
    color : #05a191;
    text-shadow: 1px 1px 1px #047064;
    }
    a.forumlink:hover{
    text-decoration: none;
    text-transform: uppercase;
    color : #07d3bd;
    margin-left: 300px;
    transition: 500ms linear 1ms;
    }
    #stats_forum{
    float: right;
    display: inline-block;
    padding-top: 10px;
    text-align: right;
    font-size: 10px;
    font-family: 'Georgia';
    color : #05a191;
    }
    .description_forum{
    position: relative;
    float: left;
    margin: 5px 10px 5px 10px;
    width: 65%;
    height: 80px;
    border: 1px solid #000;
    padding: 10px;
    }
    .icones_messages{
    position: relative;
    float: left;
    display: inline-block;
    margin: 5px 10px -110px 0px;
    width: 10%;
    height: 100px;
    }
    .dernier_message{
    position: relative;
    float: right;
    display: inline-block;
    margin: 5px 10px 5px 0px;
    width: 17%;
    height: 100px;
    border: 1px solid #000;
    text-align: center;
    font-size: 12px;
    }
    .dernier_message span{
    font-size: 12px;
    }
    .sous_forums{
    background-color: #000;
    width: 99%;
    height: 20px;
    overflow-y: auto; 
    padding: 5px;
    margin-bottom: 10px;
    }
    .credits, a.credits, a.credits:visited, a.credits:active{
    display: inline-block;
    margin: auto;
    text-align: center;
    font-size: 8px;
    font-family: 'Georgia';
    color : #05a191;
    text-shadow: 1px 1px 1px #047064;
    }
    a.credits:hover{
    text-decoration: none;
    text-transform: uppercase;
    color : #07d3bd;
    }
    /* PARTIE QUI VA DANS LA DESCRIPTION D'UN FORUM */
    .texte_description{
    position: relative;
    float: left;
    width: 440px;
    height: 80px;
    overflow-y: auto;
    -webkit-hyphens: auto;
    o-hyphens: auto;
    hyphens: auto;
    color: #05a191;
    }
    .img_description{
    position: relative;
    float: right;
    width: 70px;
    height: 80px;
    }

    Et voici le code que vous devez mettre dans la description de vos forums(PA -> Général -> Catégories et forums) :
    Code:
    <span class="texte_description">Quis enim aut eum diligat quem metuat, aut eum a quo se metui putet? Coluntur tamen simulatione dumtaxat ad tempus. Quod si forte, ut fit plerumque, ceciderunt, tum intellegitur quam fuerint inopes amicorum. Quod Tarquinium dixisse ferunt, tum exsulantem se intellexisse quos fidos amicos habuisset, quos infidos, cum iam neutris gratiam referre posset. </span> <img class="img_description" src="http://img11.hostingpics.net/pics/64174470x80.png" />

    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.
    avatar
    Nymeria.
    FémininAge : 23Messages : 308

    le Dim 30 Aoû 2015 - 13:50

    Merci !! Very Happy
    avatar
    Deadpoolio
    MasculinAge : 28Messages : 277

    le Mar 15 Sep 2015 - 10:55

    Merci beaucoup :)
    avatar
    Araki
    MasculinAge : 28Messages : 135

    le Mer 23 Sep 2015 - 12:29

    Merci, en espérant que ce code ne soit pas comme les nombreux autre, plein de bugs ou d'incompatibilités, mais merci, ca semble simple et efficace, bien foutu. ^^
    avatar
    Neyotox
    MasculinAge : 25Messages : 37

    le Mer 23 Sep 2015 - 23:46

    wow merci
    avatar
    fair game
    FémininAge : 28Messages : 13

    le Dim 27 Sep 2015 - 1:32

    merci
    avatar
    Bunny Lune
    FémininAge : 29Messages : 143

    le Dim 27 Sep 2015 - 12:03

    Bonjour,

    Merci pour le partage.
    avatar
    meolyne
    FémininAge : 34Messages : 70

    le Lun 28 Sep 2015 - 17:43

    Merci à vous
    Isalya
    FémininAge : 22Messages : 12

    le Dim 11 Oct 2015 - 16:31

    Merci !
    avatar
    Raymanou
    MasculinAge : 26Messages : 49

    le Dim 18 Oct 2015 - 15:41

    merci
    avatar
    P'tit loup
    MasculinAge : 36Messages : 445

    le Ven 23 Oct 2015 - 10:30

    Thanks



    avatar
    Kiowa
    FémininAge : 29Messages : 220

    le Ven 23 Oct 2015 - 14:06

    Un gros merci
    avatar
    Joh.A
    FémininAge : 25Messages : 8

    le Sam 14 Nov 2015 - 13:19

    Genial :)
    avatar
    Tit_Kiwi
    FémininAge : 27Messages : 26

    le Lun 16 Nov 2015 - 11:33

    Merci beaucoup :heart:
    avatar
    Haru-Raka
    FémininAge : 31Messages : 38

    le Mar 17 Nov 2015 - 22:13

    encore des test, je finirai à trouver le truc x)
    avatar
    Rhoswen Fay
    FémininAge : 31Messages : 66

    le Sam 21 Nov 2015 - 1:20

    merci
    avatar
    Sweet Angel
    FémininAge : 35Messages : 148

    le Dim 29 Nov 2015 - 11:41

    Merci
    avatar
    Lilie
    FémininAge : 35Messages : 162

    le Dim 29 Nov 2015 - 12:16

    Oh ça m'intéresse :) Merci !
    avatar
    Shadaan
    FémininAge : 26Messages : 80

    le Dim 6 Déc 2015 - 17:32

    Parfait, merci ♥



    avatar
    Pandora Blue
    FémininAge : 30Messages : 29

    le Mar 8 Déc 2015 - 18:39

    Pile ce qu'il me fallait ! Merci beaucoup ♥



    I CAN'T CONTROL
    THIS BLOODLUST
    avatar
    Grande
    FémininAge : 30Messages : 207

    le Lun 28 Déc 2015 - 7:32

    Merci =D



    avatar
    Skullewen
    FémininAge : 22Messages : 17

    le Mer 13 Jan 2016 - 12:57

    merci beaucoup
    avatar
    reshiram44
    MasculinAge : 20Messages : 380

    le Sam 16 Jan 2016 - 23:04

    merci



    avatar
    Kaleessi
    FémininAge : 26Messages : 73

    le Lun 1 Fév 2016 - 4:02

    Ohhh Merci beaucoup!! :)
    avatar
    Kilda
    FémininAge : 38Messages : 73

    le Lun 1 Fév 2016 - 23:44

    merci
    avatar
    Malédictia
    FémininAge : 23Messages : 5

    le Jeu 3 Mar 2016 - 13:17

    Merci beaucoup  !
    Contenu sponsorisé


      La date/heure actuelle est Mer 12 Déc 2018 - 12:30