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 :
Code promo Nike : -25% dès 50€ d’achats sur tout le site Nike
Voir le deal

    The Lord of the Rings

    Alumine
    Alumine
    FémininAge : 27Messages : 487

    Lun 16 Fév 2015 - 18:39

    Rappel du premier message :



    Catégories The Lord of the Rings


    Version PHPBB2 - Aperçu - Police: Bilbo Swash caps clic pour l'installer - images de P@lcopie et Ivy Tyler



    HTML


    Rendez-vous dans votre template index_box (affichage>template>général>index_box) et remplacez-le entièrement par celui-ci:
    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="titrecategorie" width="100%">{catrow.tablehead.L_FORUM}</div>

      <table class="forumline categorie" width="100%" border="0" cellspacing="0" cellpadding="0">
       <!-- END tablehead -->
       <!-- BEGIN cathead -->
       <tr>
          <td class="{catrow.cathead.CLASS_CAT}" colspan="{catrow.cathead.INC_SPAN}" width="100%">
             <h{catrow.cathead.LEVEL} class="hierarchy">
                <span class="cattitle">
                   <a class="cattitle" title="{catrow.cathead.CAT_DESC}" href="{catrow.cathead.U_VIEWCAT}">{catrow.cathead.CAT_TITLE}</a>
                </span>
             </h{catrow.cathead.LEVEL}>
          </td>
       </tr>
       <!-- END cathead -->
       <!-- BEGIN forumrow -->
       <tr>
              <td class="forumgauche">
                <h{catrow.forumrow.LEVEL} class="hierarchy">
                  <span class="forumlink"><a class="forumlink" href="{catrow.forumrow.U_VIEWFORUM}">{catrow.forumrow.FORUM_NAME}</a><br /></span>
                </h{catrow.forumrow.LEVEL}>
                <span class="gensmall">Sujets: {catrow.forumrow.TOPICS} </span>
                <span class="gensmall">Messages: {catrow.forumrow.POSTS}</span>
              </td>
             
              <td class="forumcentre" colspan="{catrow.forumrow.INC_SPAN}" valign="top" width="100%" height="50">
                <span class="genmed">{catrow.forumrow.FORUM_DESC}</span>
                <div class="sousforum">
                  {catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}
                </div>
              </td>
             
              <td class=" forumdroite" align="center" valign="middle">
                <img class="boutonnouveau" title="{catrow.forumrow.L_FORUM_FOLDER_ALT}" src="{catrow.forumrow.FORUM_FOLDER_IMG}" alt="{catrow.forumrow.L_FORUM_FOLDER_ALT}" />
                <div class="dernierpost">
                <!-- BEGIN avatar -->
                <div style="width: 200px;"></div>
                <span class="lastpost-avatar">{catrow.forumrow.avatar.LAST_POST_AVATAR}</span>
                <!-- END avatar -->
                <span class="gensmall">{catrow.forumrow.LAST_POST}</span>
                </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 class="bascategorie">
      <img src="http://image.noelshack.com/fichiers/2015/07/1423492133-f-coingauche.png" class="coingauche" />
      <img src="http://image.noelshack.com/fichiers/2015/07/1423492133-f-coindroite.png" class="coindroite" />
    </div>
    <!-- END tablefoot --><!-- END catrow -->
    Enregistrez puis publiez votre template, sinon ça marchera pas x)


    CSS


    Ensuite direction le CSS (affichage>couleurs>feuille de style CSS)
    Ajoutez ceci:
    Code:
    /*catégories seigneur des anneaux par Alu pour Never Utopia****************************************/
    .forumgauche, .forumcentre, .forumdroite{
      box-sizing:border-box;
      display:inline-block;
      padding:10px;
      color:white;
      margin-bottom:25px;
      height:150px;
      z-index:1;
    }
    .forumgauche{
      width: 25%;
      background-color: #000000;
      background-image: url(http://image.noelshack.com/fichiers/2015/07/1423490967-f-background.png);
      background-position:bottom;
      background-size:contain;
      background-repeat:no-repeat;
      position:relative;
      border-top-left-radius: 35% 15%;
      border-bottom-left-radius: 35% 15%;
    }

    .forumcentre{
      background:#191919;
      width:50%;
      position:relative;
    }
    .forumdroite{
      background-image:url(http://image.noelshack.com/fichiers/2014/52/1419283627-anneau.jpg);
      background-size: contain;
      background-color: #000000;
      background-repeat: no-repeat;
      background-position:center;
      width:25%;
      position:relative;
      border-top-right-radius: 35% 15%;
      border-bottom-right-radius: 35% 15%;
    }

    .dernierpost{
      position:relative;
      top:30px;
      margin-left:auto;
      margin-right:auto;
      width:100px;
      height:50px;
      z-index:1;
    }

    .dernierpost .gensmall span{
      font:9px;
    }
    .dernierpost a{
      font:15px;
      color:grey;
    }

    .boutonnouveau{
      left: 23%;
      position: absolute;
      top: 0px;
      z-index: 2;
      margin: 25px auto;
      display: block;
      -webkit-transition:all 1s;
      -moz-transition:all 1s;
      -o-transition:all 1s;
      transition:all 1s;
    }

    .forumdroite:hover > .boutonnouveau{
      left:75%;
      -webkit-transition:all 1s;
      -moz-transition:all 1s;
      -o-transition:all 1s;
      transition:all 1s;
    }

    .sousforum{
      box-sizing:border-box;
      position:absolute;
      bottom:0px;
      left:0px;
      background:#000000;
      text-align:center;
      width:100%;
      padding:7px;
      height:40px;
      overflow:auto;
    }
    .sousforum a{
      font: 19px Bilbo Swash Caps;
      color:white !important;
    }

    .forumlink a{
      font:30px Bilbo swash caps;
      color:white !important;
    }

    .titrecategorie{
      box-sizing:border-box;
      padding: 30px 30px 0 30px;
      height:100px;
      margin-top:50px;
      background-image:url(http://image.noelshack.com/fichiers/2015/07/1423490971-f-titregauche.png),
        url(http://image.noelshack.com/fichiers/2015/07/1423490970-f-titredroite.png);
      background-position: 6% 100%, 94% 100%;
      background-repeat:no-repeat, no-repeat;
      background-size:auto 70px, auto 70px;
    }
    .titrecategorie h2{
      text-align:center;
      color:white;
      font-family:Bilbo swash caps;
      font-size:50px;
      margin:0;
      font-weight:normal;
    }
    .bascategorie{
      height:50px;
      margin-bottom:50px;
      position:relative;
    }
    .categorie{
      padding:10px 40px;
    }

    .coingauche{
      display:block;
      position:absolute;
      width:40%;
      bottom:20px;
      left:-20px;
      z-index:0;
    }
    .coindroite{
      display:block;
      position:absolute;
      width:40%;
      bottom:20px;
      right:-20px;
      z-index:0;
    }

    Merci de poster un crédit pour N-U sur votre forum, ça ne coûte pas grand-chose ! ^^

    Un petit merci ou commentaire est toujours le bienvenu ^^
    Si vous avez des problèmes avec ce LS ou des questions, venez poster ici.


    Dernière édition par Alumine le Lun 16 Fév 2015 - 20:01, édité 1 fois



    Alumine
    LightGlace
    LightGlace
    FémininAge : 32Messages : 43

    Mar 22 Nov 2016 - 19:10

    mercii !
    Kush-Live
    Kush-Live
    MasculinAge : 30Messages : 12

    Mar 20 Déc 2016 - 6:54

    Merci :)
    Egyfu
    Egyfu
    FémininAge : 31Messages : 56

    Sam 22 Avr 2017 - 11:11

    OH ! Mille mercis ! Exactement ce qu'il me fallait Very Happy
    RigoloDiabolo_
    RigoloDiabolo_
    MasculinAge : 23Messages : 15

    Dim 23 Avr 2017 - 12:07

    mrc
    NanoiHime
    NanoiHime
    FémininAge : 26Messages : 566

    Jeu 1 Juin 2017 - 0:37

    mercii



    Jujudu44
    Jujudu44
    FémininAge : 36Messages : 61

    Lun 5 Juin 2017 - 14:51

    C'est magnifique, merci !
    Destan
    Destan
    MasculinAge : 46Messages : 38

    Ven 4 Aoû 2017 - 23:36

    Merci
    Offrande
    Offrande
    FémininAge : 33Messages : 194

    Jeu 10 Aoû 2017 - 22:02

    Magnifique <3
    Loo
    Loo
    FémininAge : 30Messages : 22

    Lun 28 Aoû 2017 - 1:58

    Merciiii ! Very Happy
    Necrolythia
    Necrolythia
    FémininAge : 37Messages : 580

    Mar 26 Sep 2017 - 22:17

    classe, j'aime

    merciiiiiiiiiiiiiiiiiii



    The Lord of the Rings - Page 5 KKEVK8u
    Titi | Luna
    Titi | Luna
    FémininAge : 19Messages : 51

    Mar 10 Oct 2017 - 18:52

    Coucou !
    J'adore ton code (comment que vous faite... moi connais que bbcode...)
    MadSushi
    MadSushi
    FémininAge : 28Messages : 25

    Mer 18 Oct 2017 - 15:06

    Merci :)
    benficagirl
    benficagirl
    FémininAge : 38Messages : 450

    Mar 28 Nov 2017 - 15:32

    C'est super beau :)
    Kokola
    Kokola
    FémininAge : 30Messages : 23

    Ven 12 Jan 2018 - 19:33

    Merci beaucoup ! ham1 ham1
    Fawadja
    Fawadja
    MasculinAge : 30Messages : 32

    Ven 9 Mar 2018 - 15:59

    Merci à toi :)
    Shide
    Shide
    FémininAge : 35Messages : 60

    Dim 18 Mar 2018 - 21:27

    merçi
    Abby Reever
    Abby Reever
    FémininAge : 32Messages : 146

    Jeu 10 Mai 2018 - 13:04

    C'est magnifique ! ** J'adore ! Bravo à toi !
    Anonymous
    Invité

    Sam 26 Mai 2018 - 20:58

    merci
    Idril Palanén
    Idril Palanén
    FémininAge : 32Messages : 83

    Jeu 14 Juin 2018 - 16:42

    Magnifique ! Je prends pour un futur projet qui sait ! :)
    picka234
    picka234
    FémininAge : 59Messages : 636

    Mer 9 Jan 2019 - 21:50

    merci
    Illeanëlia
    Illeanëlia
    FémininAge : 38Messages : 404

    Jeu 10 Jan 2019 - 18:36

    Magnifique ça doit en prendre du temps pour faire ça c'est très beau
    falho
    falho
    MasculinAge : 38Messages : 1

    Mar 29 Jan 2019 - 15:32

    Merci Wink
    Contenu sponsorisé


      La date/heure actuelle est Jeu 21 Nov 2024 - 9:45