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.


    QEEL en dégradé de vert

    Partagez
    avatar
    Sauney
    FémininAge : 22Messages : 428

    le Ven 10 Oct 2014 - 2:14

    Rappel du premier message :

    Et le deuxième LS qui va avec la PA en dégradé de vert et les Catégories en dégradé de vert .

    Alors, un exemple pour se mettre dans le bain :


    Allez dans "Panneau d'administration" > "Affichage" > "Templates" > "Général" > "index_body"
    Chercher la partie entre
    Code:
    <!-- BEGIN disable_viewonline -->
    CODE
    <!-- END disable_viewonline -->

    Remplacez tout ça par :
    Code:
    <!-- BEGIN disable_viewonline -->
    <table class="cadre_qeel" width="100%" border="0" cellspacing="1" cellpadding="0">
       <tr>
          <td colspan="2" height="28" align="center">
          <!-- BEGIN switch_viewonline_link -->
          <span class="qeel_titre"><a class="qeel_titre" href="{U_VIEWONLINE}" rel="nofollow"><img class="qeel_titre" src="http://img11.hostingpics.net/pics/629131qeel.png" alt="Qui est dans l'Apoclypse ?" /></a></span>
          <!-- END switch_viewonline_link -->

          <!-- BEGIN switch_viewonline_nolink -->
                      <span class="qeel_titre"><img class="qeel_titre" src="http://img11.hostingpics.net/pics/629131qeel.png" alt="Qui est dans l'Apoclypse ?" /></span>
          <!-- END switch_viewonline_nolink -->
          </td>
       </tr>
         <tr>
          <td colspan="2" align="center"><div class="groupes_qeel">
          <p class="groupe1">Groupe1</p>
          <p class="groupe2">Groupe2</p>
          <p class="groupe3">Groupe3</p>
          <p class="groupe4">Groupe4</p>
          <p class="groupe5">Groupe5</p>
          <p class="groupe6">Groupe6</p>
          <p class="groupe7">Groupe7</p></div></td>
       </tr>
       <tr><td><div class="infos_qeel"><span class="gensmall">{TOTAL_POSTS}<br />
          {TOTAL_USERS}<br />
                    {NEWEST_USER}<br />
                    {TOTAL_USERS_ONLINE}<br />
              {RECORD_USERS}</span></div></td>
              <td><div class="membres_liste"><span class="gensmall">
                {TOTAL_USERS_ONLINE}<br />
                {LOGGED_IN_USER_LIST}</span></div>
              </td>
      </tr>
      <tr><td align="right" colspan="2"><span class="gensmall" style="font-size: 10px;padding-right: 5px;">Codage : Sauney de <a href="http://www.never-utopia.com/">Never Utopia</a></span>
    </td>
       </tr>
    </table>
    <!-- END disable_viewonline -->
    Enregistrez et n'oubliez pas de publier !

    P.S.: J'ai supprimé les anniversaires, les membres connectés au cours des dernières Xh et les données de la CB(utilisateurs en ligne).

    Et pour le CSS rendez-vous dans "Panneau d'administration" > "Affichage" > "Images et couleurs" > "Couleurs" > "Feuille de style CSS" et ajoutez :
    Code:
    /* DEBUT DU QEEL */
    .cadre_qeel{
    width: 950px;
    margin: 50px auto 10px auto;
    background: linear-gradient( #c9de96, #398235); /* gère le dégradé, 1ère couleur= couleur du haut, 2ième couleur= couleur du bas */
    border-width: 4px 2px 4px 2px;
    border-style: solid;
    border-color: #fff;
    border-radius: 10px 0px 10px 0px;
    color: #121212;
    padding: -20px 5px 5px 5px;
    font-size: 12px;
    }
    .qeel_titre, a.qeel_titre, a.qeel_titre:active, a.qeel_titre:visited{
    position: relative;
    top: -15px;
    font-family: 'Georgia';
    font-size: 25px;
    text-align: center;
    text-decoration: none !important;
    color: #398235;
    text-shadow: 1px 1px 1px #000;
    }
    a.qeel_titre:hover{
    text-decoration: none !important;
    color: #c9de96;
    text-shadow: 1px 1px 1px #000;
    transition: 350ms color linear, 350ms text-shadow linear;
    }
    .infos_qeel{
    position: relative;
    float: left;
    width: 450px;
    height: auto;
    padding: 10px 5px 10px 10px;
    text-align: left;
    }
    .membres_liste{
    position: relative;
    float: right;
    width: 450px;
    height: 50px;
    overflow-y: auto;
    padding: 10px 5px 10px 10px;
    border-left: 2px solid #fff;
    text-align: left;
    }
    /* Code les groupes */
    .groupes_qeel{
    width: 650px;
    height: 30px;
    margin: -30px auto -15px auto;
    padding: 10px;
    }
    .groupe1, .groupe2, .groupe3, .groupe4, .groupe5, .groupe6, .groupe7 {
    display: inline;
    font-weight: bold;
    font-family: 'Patrick Hand SC';
    text-align: center;
    font-size: 20px;
    text-shadow: 0px 0px 2px #000;
    }
    .groupe1 {
    color: #dd5549 !important;
    margin-right: 20px; 
    }
    .groupe2 {
    color: #5176b4 !important;
    margin-right: 20px; 
    }
    .groupe3 {
    color: #d19656 !important;
    margin-right: 20px; 
    }
    .groupe4 {
    color: #579c5a !important;
    margin-right: 20px; 
    }
    .groupe5 {
    color: #8A2388 !important;
    margin-right: 20px; 
    }
    .groupe6 {
    color: #3AA19F !important;
    margin-right: 20px; 
    }
    .groupe7 {
    color: #666262 !important; 
    }
    /* FIN DU QEEL */
    Enregistrez et voilà Very Happy

    P.S. : La couleur de la police, des liens autres que ceux des forums se modifiera pour adopter celle que vous avez mise en place, de même pour les soulignement des liens. Wink

    Mettre un crédit vers Never-Utopia est obligatoire. Retirer un crédit est interdit.
    Si vous avez des problèmes avec ce LS, venez poster ici.
    Merci de laisser un message pour donner vos impressions, commentaires et/ou remerciements ^^



    avatar
    Lovelymp
    FémininAge : 38Messages : 58

    le Ven 18 Mar 2016 - 15:40

    Merci simple et efficace
    avatar
    ass kicker
    FémininAge : 23Messages : 80

    le Mer 30 Mar 2016 - 18:57

    merci



      see you again
      No matter where you are, whether you’re a quarter mile away, or half way around the world … you’ll always be with me. You’ll always be my brother.©endlesslove
    avatar
    Bully
    FémininAge : 15Messages : 39

    le Lun 20 Juin 2016 - 12:44

    merci !
    avatar
    Kâ Lys
    MasculinAge : 55Messages : 299

    le Sam 16 Juil 2016 - 18:54

    Merci



    avatar
    Aubenaissante
    MasculinAge : 32Messages : 15

    le Lun 8 Aoû 2016 - 9:08

    yo merci !
    avatar
    Saphira
    FémininAge : 21Messages : 72

    le Mar 30 Aoû 2016 - 23:10

    merci
    avatar
    marie-noelle
    FémininAge : 60Messages : 109

    le Ven 17 Fév 2017 - 1:17

    merci
    avatar
    Doku
    FémininAge : 23Messages : 65

    le Dim 12 Mar 2017 - 2:41

    merci
    avatar
    Aaw.
    FémininAge : 21Messages : 29

    le Mar 18 Avr 2017 - 15:39

    Merci beaucoup !
    avatar
    Mikee
    MasculinAge : 21Messages : 4

    le Jeu 15 Juin 2017 - 8:30

    Merci
    avatar
    KannaFantasy
    FémininAge : 25Messages : 24

    le Dim 10 Sep 2017 - 21:38

    Simple mais très jolie merci Very Happy
    avatar
    Necrolythia
    FémininAge : 30Messages : 512

    le Sam 11 Nov 2017 - 11:39

    merci beaucoup, pile ce que je voulais



    avatar
    nini
    FémininAge : 33Messages : 19

    le Lun 18 Déc 2017 - 17:26

    Merci beaucoup
    avatar
    Amasis
    FémininAge : 45Messages : 307

    le Dim 8 Avr 2018 - 15:58

    Merci :hudada:
    avatar
    Lancy Orca
    FémininAge : 27Messages : 20

    le Mar 17 Avr 2018 - 14:37

    Merci du partage :)
    Contenu sponsorisé


      La date/heure actuelle est Jeu 21 Juin 2018 - 18:22