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 :
(CDAV) Foire aux vins : -20% dès 99€ d’achat
Voir le deal

    Catégories Taupes

    A-Lice
    A-Lice
    FémininAge : 29Messages : 4939

    Ven 10 Avr 2015 - 18:31

    Rappel du premier message :




    Catégories Taupes


    Suite à une demande de Moys voici des catégories taupes.

    Je précise que l'arrière plan rose pâle correspond à mon forum.

    HTML & CSS ~ Voici donc un aperçu : www ~ phpBB2


    Et le code :
    Template index_box à remplacer en entier :
    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 --><!-- END tablehead -->
       <!-- BEGIN cathead -->
          <!-- BEGIN inc --><!-- END inc -->
       <!-- END cathead -->
       <!-- BEGIN forumrow -->
          <!-- BEGIN inc --><!-- END inc -->
    <div class="cat_titre"><a class="cat_titre" title="{catrow.cathead.CAT_DESC}" href="{catrow.forumrow.U_VIEWFORUM}">{catrow.forumrow.FORUM_NAME}</a></div>
    <div class="cat_bloc1"><div class="cat_desc">{catrow.forumrow.FORUM_DESC}
          <!-- BEGIN switch_moderators_links -->
                {catrow.forumrow.switch_moderators_links.L_MODERATOR}{catrow.forumrow.switch_moderators_links.MODERATORS}
          <!-- END switch_moderators_links --></div> <div class="cat_sousfora" id="sousfora">{catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}</div></div>
    <script type="text/javascript">
      <!--
                          jQuery('#sousfora').html(jQuery('#sousfora').html().replace(/, /g,'<div style="width: 100%; border-bottom: 2px solid black; margin-top: 5px; margin-bottom: 5px;"></div>')).removeAttr('id');
      jQuery(document).ready(function(){
        jQuery('a.gensmall').each(function (){
        var texte = jQuery(this).attr('title') ;
        if(texte){
        texte = texte.replace(/\<\/a\>/gi, '').replace(/\<br \/\>/gi, '').replace(/\<br >/gi, '');
        jQuery(this).attr('title', texte);
        }
        });
      });
      //-->
      </script>
    <div class="cat_bloc2"><img title="{catrow.forumrow.L_FORUM_FOLDER_ALT}" src="{catrow.forumrow.FORUM_FOLDER_IMG}" alt="{catrow.forumrow.L_FORUM_FOLDER_ALT}" /><div style="padding: 10px;">{catrow.forumrow.TOPICS} sujets | {catrow.forumrow.POSTS} messages</div>
    {catrow.forumrow.LAST_POST}
       <!-- BEGIN avatar -->
                <div style="width: 200px;"></div>
                <span class="lastpost-avatar">{catrow.forumrow.avatar.LAST_POST_AVATAR}</span>
            <!-- END avatar --></div>
       <!-- END forumrow -->
       <!-- BEGIN catfoot -->
          <!-- BEGIN inc --><!-- END inc -->
       <!-- END catfoot -->
    <div style="height: 5px;"></div>
       <!-- BEGIN tablefoot -->
    <!-- END tablefoot --><!-- END catrow -->

    Template overall_header (après < head > ligne 4) :
    Code:
    <link href='http://fonts.googleapis.com/css?family=Poiret+One' rel='stylesheet' type='text/css'>

    CSS :
    Code:
    a.cat_titre {
    font-size: 40px;
    color: #54413d;
    font-family: 'Poiret One', cursive;
    opacity: 0.5;
    transition: all 0.5s;
    padding: 10px;
    text-indent: 15px;
    text-decoration: none;
    }

    a.cat_titre:hover {
    transition: all 0.5s;
    opacity: 1;
    }

    .cat_bloc1 {
    width: 560px;
    height: 110px;
    border: 2px solid black;
    padding: 10px;
    background: #f5f5f2;
    overflow: auto;
    display: inline-block;
    margin-top: 5px;
    }

    .cat_bloc2 {
    margin-left: 15px;
    width: 190px;
    height: 120px;
    padding: 5px;
    background: #f5f5f2;
    text-align: center;
    font-size: 12px;
    display: inline-block;
    border: 2px solid black;
    vertical-align: top;
    margin-top: 5px;
    }

    .cat_desc {
    width: 360px;
    text-align: justify;
    font-size: 12px;
    color: #9c887d;
    display: inline-block;
    vertical-align: top;
    }

    .cat_sousfora {
    width: 160px;
    padding-top: 5px;
    padding-bottom: 5px;
    background: #e0dcce;
    color: #9c887d;
    border: 2px solid black;
    text-align: center;
    font-size: 14px;
    display: inline-block;
    vertical-align: top;
    margin-left: 15px;
    }

    .cat_sousfora a.gensmall {
    color: #9c887d;
    font-size: 14px;
    }

    /*SUPRESSION DU SOULIGNEMENT DES LIENS*/
    a {text-decoration: none;}
    a:link {text-decoration: none;}
    a:hover {text-decoration: none!important;}
    a.forumlink {text-decoration: none;}
    a.forumlink:hover {text-decoration: none!important;}
    a.topiclink {text-decoration: none; }
    a.topiclink:hover {text-decoration: none!important; }
    /*Fin*/

    Remarques :
    -Le forum doit faire 830px de largeur.
    -Il ne faut absolument pas mettre de virgules dans les descriptions des sous-fora pour ne pas déformer le code.


    /!\ En cas de problème, c'est ici ou que ça ce passe.
    Un petit merci ou commentaire est toujours le bienvenu ^^
    - Mettre/laisser un crédit vers Never-Utopia est obligatoire.

    R.Falsworth
    R.Falsworth
    FémininAge : 27Messages : 92

    Mer 24 Mai 2017 - 21:57

    merci !
    (on voit plus l'image par contre :c)
    alsayed
    alsayed
    MasculinAge : 50Messages : 75

    Sam 27 Mai 2017 - 12:15

    Merci
    Dorin
    Dorin
    FémininAge : 48Messages : 33

    Sam 1 Juil 2017 - 17:12

    Merci!
    topaz3
    topaz3
    MasculinAge : 27Messages : 7

    Lun 3 Juil 2017 - 16:24

    merci
    Anonymous
    Invité

    Mar 4 Juil 2017 - 4:47

    merci
    Ailla
    Ailla
    FémininAge : 25Messages : 32

    Dim 16 Juil 2017 - 18:00

    Merci beaucoup ! :happy:
    Mini BN
    Mini BN
    FémininAge : 28Messages : 44

    Jeu 21 Sep 2017 - 0:10

    Merci pour le partage ♥
    Mariana Greyson
    Mariana Greyson
    FémininAge : 25Messages : 78

    Sam 18 Nov 2017 - 17:07

    mrc
    Tigriss
    Tigriss
    FémininAge : 29Messages : 9

    Mar 21 Nov 2017 - 18:13

    Top !
    _tomo
    _tomo
    FémininAge : 23Messages : 8

    Dim 3 Déc 2017 - 17:15

    merci :)
    November
    November
    MasculinAge : 23Messages : 50

    Dim 14 Jan 2018 - 17:16

    merci!
    benficagirl
    benficagirl
    FémininAge : 37Messages : 448

    Dim 11 Fév 2018 - 4:09

    merci
    Mirony
    Mirony
    FémininAge : 36Messages : 44

    Sam 3 Mar 2018 - 15:28

    Merci pour ce partage très jolie
    AmazingxLife
    AmazingxLife
    FémininAge : 29Messages : 3

    Dim 18 Mar 2018 - 13:37

    Merci pour ce code !
    Noir Black
    Noir Black
    FémininAge : 38Messages : 62

    Dim 6 Mai 2018 - 23:38

    merci
    Insane.
    Insane.
    FémininAge : 26Messages : 83

    Mer 9 Mai 2018 - 20:24

    merci
    Ookami Shiroi
    Ookami Shiroi
    FémininAge : 32Messages : 90

    Lun 7 Jan 2019 - 11:13

    Merci beaucoup.
    xFleurFanex
    xFleurFanex
    FémininAge : 26Messages : 6

    Mar 28 Mai 2019 - 19:47

    merci Wink
    Contenu sponsorisé


      La date/heure actuelle est Mar 19 Mar 2024 - 3:26