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.

-56%
Le deal à ne pas rater :
Ampli Home Cinema Denon AVR-X1700H à 349€
349 € 799 €
Voir le deal

    Catégories style steampunk

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

    Dim 19 Fév 2017 - 14:49



    Bonjour ou bonsoir !
    Je suis de nouveau là, de retour pour vous proposer un nouveau libre service de catégories avec un style plutôt steampunk ^-^
    Si vous rencontrez un problème avec ce libre service, n'hésitez pas à demander de l'aide dans la section Problème avec mon code. De plus, vous pouvez vous référer à la section Personnalisations si jamais vous n'y connaissez rien en codage et que vous avez du mal à changer les couleurs et autres.

    Un aperçu en image:
    Spoiler:

    Optimisé pour tous les navigateurs - Version PHPBB2

    Installer vos nouvelles catégories:
    Pour commencer l'installation de nos nouvelles catégories, nous allons devoir aller dans Panneau d'administration > Accueil > Affichage > Templates > Généralités > Index_box et remplacer le code d'origine par le suivant.

    Code:
    <div class="catLiens">
      <!-- BEGIN switch_user_logged_in -->
      <a href="{U_SEARCH_NEW}">{L_SEARCH_NEW} - </a>
      <a href="{U_SEARCH_SELF}">{L_SEARCH_SELF} - </a>
      <!-- END switch_user_logged_in -->
      <a href="{U_SEARCH_UNANSWERED}">{L_SEARCH_UNANSWERED}</a>
    </div>
    <!-- BEGIN catrow --><!-- BEGIN tablehead -->
    <div class="categorie">
     {catrow.tablehead.L_FORUM}
     <!-- END tablehead -->
     <!-- BEGIN forumrow -->
      <div class="catCentre">
      <div class="inline catGauche">
              <div class="catStats">{catrow.forumrow.TOPICS} sujets et {catrow.forumrow.POSTS} messages</div>
              <div class="inline catLast">
                      <img class="newOldLock" title="{catrow.forumrow.L_FORUM_FOLDER_ALT}" src="{catrow.forumrow.FORUM_FOLDER_IMG}" alt="{catrow.forumrow.L_FORUM_FOLDER_ALT}" /><br />
      {catrow.forumrow.LAST_POST}
              </div>
              <div class="inline catAvatar">
     <!-- BEGIN avatar -->
                      {catrow.forumrow.avatar.LAST_POST_AVATAR}
      <!-- END avatar -->
              </div>
      <div class="inline sousForums">{catrow.forumrow.LINKS}</div>
      </div>
      <div class="inline catDroite">
      <a class="catTitreForum" href="{catrow.forumrow.U_VIEWFORUM}">{catrow.forumrow.FORUM_NAME}</a>
      <div class="catDescrip">{catrow.forumrow.FORUM_DESC}</div>
            </div>
      </div>
     <!-- END forumrow -->
     <!-- BEGIN tablefoot -->
      <img src="http://zupimages.net/up/17/13/mt9t.png" />
    </div><!-- END tablefoot --><!-- END catrow -->

    Une fois cela fait, enregistrez et validez votre template.

    Nous allons ensuite devoir ajouter le CSS qui va le rendre super stylé. Du coup, on va aller dans Affichage > Images et Couleurs > Couleurs > Feuille de style CSS

    Code:
    /* Catégories réalisées par Cheshire Cat */
    .catLiens{
      text-align:center;
    }
    .categorie{
      width:800px;
      margin:0 auto;
      font-family:calibri;
      font-size:12px;
    }
    .inline{
      display:inline-block;
      vertical-align:top;
    }
    .categorie h2{
      margin:20px 0 0;
      padding:30px 0;
      box-sizing:border-box;
      background-image:url('http://zupimages.net/up/17/13/mt9t.png');
      font-size:30px;
      font-weight:normal;
      text-align:center;
      color: #523e32;
      text-shadow: 0 0 3px #55493f;
    }
    .catCentre{
      padding:0 20px 40px 20px;
      background:#21130d;
    }
    .categorie h2 + .catCentre{
      padding-top:40px;
    }
    .catGauche{
      width:400px;
      background-color:#a9a08b;
      margin-right:10px;
      padding:10px;
      box-sizing:border-box;
    }
    .catStats{
      color:#654f3f;
      font-size:15px;
      margin-bottom:3px;
      text-transform:uppercase;
      letter-spacing:1px;
    }
    .catLast{
      width:130px;
      height:120px;
      padding:5px;
      box-sizing:border-box;
      background-color:#ccc6b8;
      text-align:center;
      line-height:20px;
      overflow:auto;
    }
    .catAvatar{
      width:80px;
      height:120px;
      margin:0 10px;
      overflow:hidden;
      background-color:#ccc6b8;
    }
    .catAvatar img{
      width:100%;
    }
    .sousForums{
      width:150px;
      height:120px;
      background-color:#ccc6b8;
      font-size:0;
      overflow: auto;
    }
    .sousForums a{
      display:block;
      background:#fff;
      font-size:12px;
      text-align:center;
      margin-bottom:5px;
    }
    .catDroite{
      width:350px;
      background-color:#a9a08b;
      padding:10px;
      box-sizing:border-box;
    }
    .catTitreForum {
      font-size:15px;
      text-transform:uppercase;
      letter-spacing:1px;
    }
    .catDescrip{
      height:120px;
      background-color:#ccc6b8;
      margin-top:5px;
      padding:10px;
      overflow:auto;
      text-align:justify;
      box-sizing:border-box;
    }

    N'hésitez pas à poster un petit message, ça fait toujours plaisir !
    Onyx
    Onyx
    FémininAge : 31Messages : 3350

    Lun 18 Sep 2017 - 16:03

    Salut!

    Ça m'a l'air parfait, je mets le tout en libre service ^^
    Merci du partage !



    rosebleudu10
    rosebleudu10
    FémininAge : 34Messages : 189

    Jeu 2 Nov 2017 - 11:07

    merci pour ce codage
    Anonymous
    Invité

    Jeu 2 Nov 2017 - 17:30

    Merci pour le partage !
    Dixy
    Dixy
    FémininAge : 30Messages : 234

    Dim 5 Nov 2017 - 1:42

    Merci !



    Catégories style steampunk ?c=isi&im=%2F8762%2F84558762%2Fpics%2F3210667051_1_13_DkYrqtSL
    AMYROSSLEDGER
    AMYROSSLEDGER
    FémininAge : 30Messages : 37

    Mer 15 Nov 2017 - 21:51

    quel talent tu as là, c'est magnifique, j'adore !
    excellent travail :love:
    AriusMart
    AriusMart
    MasculinAge : 37Messages : 1

    Mar 21 Nov 2017 - 13:47

    Merci Beaucoup, j'adore se style Steam Punk ! Very Happy
    Celuna
    Celuna
    FémininAge : 34Messages : 133

    Jeu 22 Mar 2018 - 8:58

    Merci pour ce magnifique partage
    Alouarn
    Alouarn
    MasculinAge : 33Messages : 132

    Ven 30 Mar 2018 - 18:10

    Merci beaucoup ! **

    Ces catégories sont trop cool ! **
    Lone wanderer
    Lone wanderer
    MasculinAge : 32Messages : 176

    Lun 18 Juin 2018 - 0:04

    merci ! :)
    Dawn_sentences
    Dawn_sentences
    FémininAge : 44Messages : 1

    Jeu 22 Nov 2018 - 21:37

    merci !
    Gieve
    Gieve
    FémininAge : 35Messages : 123

    Mer 1 Mai 2019 - 14:57

    Merci ^^
    Sophia Howarth
    Sophia Howarth
    FémininAge : 25Messages : 56

    Mer 16 Oct 2019 - 16:28

    Merci !

    Je te le pique, il est trop sublime !
    Bloody Horizon
    Bloody Horizon
    FémininAge : 27Messages : 27

    Mar 21 Juin 2022 - 18:42

    Merci pour le partage!
    Coralina
    Coralina
    FémininAge : 24Messages : 19

    Mer 27 Juil 2022 - 17:30

    Magnifique, Merci beaucoup !
    Contenu sponsorisé


      La date/heure actuelle est Lun 2 Déc 2024 - 11:14