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 3 colones + Chatbox

    Partagez
    avatar
    Databar
    MasculinAge : 24Messages : 142

    le Lun 24 Mar 2014 - 10:02

    Rappel du premier message :


    Creation: Version 4.1 du forum "RôlePlay Universe"
    Code en libre service distribué que par les membres de RôlePlay Universe avec accord du staff. Ressource en libre service, creditez au nom de RôlePlay Universe et Never Utopia si vous l'utilisez (je vous force pas mais par respect faites le ^^)

    Exemple:


    Commencons :) Tout d'abord on va devoir modifier votre template, je vous explique:


    • Trouvez dans "index_body" le code se situant entre les lignes

    :

    Code:
    <!-- BEGIN disable_viewonline --> et <!-- END disable_viewonline -->


    • Puis remplacez-les par ce code:



    Code:
       <script type="text/javascript">
        //<![CDATA[
        $(function(){
           div_marquee('comments_scroll_div', 'comments_scroll_container', '{SCROLL_WAY}', '{SCROLL_STEP}', '{SCROLL_DELAY}', '{SCROLL_HEIGHT}', 'genmed');
        });
        //]]>
        </script>
        <table class="qeeltable" width="100%" border="0" cellspacing="1" cellpadding="0">
          <center> <div class="titreqeel"><a href="http://fr.cooltext.com"><img src="http://images.cooltext.com/3365718.png" width="252" height="31" alt="Qui est en ligne?" /></a></div></center>
          <tr>
          <td><div class="boxqeel">{TOTAL_POSTS}<br/><br/>{TOTAL_USERS}<br/>{NEWEST_USER}<br/><br/>{LOGGED_IN_USER_LIST}</div></td>
            <td><div class="boxqeel">{TOTAL_USERS_ONLINE}<br/><br/>{RECORD_USERS}<br/><br/>{TOTAL_USERS_ONLINE}<br/><br/>{TOTAL_CHATTERS_ONLINE}:  {CHATTERS_LIST}</div></td>
            <td><div class="boxqeel2"><div class="teamadmin">Team Admin</div><br/>
        <div class="teammodo">Team Modo</div><br/>
        <div class="membreslfu">Membre</div><br/>
        <div class="teampartenaire">Partenaire</div><br/>
        <div class="teamvoyageur">Voyageur</div><br/>
        <div class="teampnj">Compte PNJ</div></div></td>
        </tr>
        <tr>
        <td colspan="3"><div class="groupeqeel"><div class="profilmasque" onClick="this.firstChild.value=(this.firstChild.value=='Ouvrir la Chatbox')?'Fermer la Chatbox':'Ouvrir la Chatbox';this.lastChild.style.display=(this.firstChild.value=='Ouvrir la Chatbox')?'none':'block';" style="text-align: center;">
        <input type="button" value="Ouvrir la Chatbox" class="profil1"/>
        <div style="display: none;  text-align:left;"><center><table class="forumline" width="100%" border="0" cellspacing="1" cellpadding="0" id="chatbox_container">
           <tr>
              <td class="row1" valign="top" align="center">
                 <div id="chatbox_portal" style="height:300px;"></div>
                 <script type="text/javascript">
                    insertChatBox('chatbox_portal', '{U_FRAME_CHATBOX}');
                 </script>
              </td>
           </tr>
        </table>

        <table width="100%">
           <tr>
              <td width="100%"> </td>
              <td align="right" width="20">
                 <img src="http://illiweb.com/fa/resize.gif" onmousedown="javascript:resizeElement(event, 'chatbox_portal');" alt="" style="cursor:se-resize;" />
              </td>
           </tr>
        </table></center></div></div></div></td>
        <tr>        <div class="infobulle"><font style="color: #005B89; font-size: 9px;">Voir les Credits
                <span>Ce QEEL a eté codé par Databar pour le forum RôlePlay Universe</span></div></tr>
          </tr>
        </table>

    Ne supprimez pas les deux balise si-dessus, remplacez juste le code qui se situe entre ces ligne



    • Ensuite on passe au code css, la rien de compliqué il vous suffit juste de copier ce code dans votre espace css




    • Code:
        .titreqeel{
          position:center;
          padding-bottom: -7;
          }
          .boxqeel {
          background-color : #003B59;
          border : 1px solid #005B89;
          border-radius: 5px;
          border-top : 3px solid #005B89;
          padding : 5px;
          height: 190px;
          font-size:12px;
          /*width: 265px;*/
          margin-top:7px;
          }
          .teamadmin{
          border-top: 1px solid #005B89;
          border-bottom: 1px solid #005B89;
          margin-top:: 0px;
          color: #FF0000;
          font-family:: cursive;
          text-shadow: 0px 0px 1px #000;
          }

                  .infobulle{position: relative;z-index: 0;}
                  
                 .infobulle:hover{background-color: transparent;z-index: 50;}
                  
                 .infobulle span{
                  position: absolute;
                  background-color: #000000;
                  padding: 5px;
                  left: -1000px;
                  visibility: hidden;
                  color: #FFFFFF;}
                  
                 .infobulle span img{border: 1px;padding: 5px;}
                  
                 .infobulle:hover span{
                  visibility: visible;
                  top: 2px;
                  left: 20px;
                  width: 150px ;
                  color:#FFF;
                  border: 1px solid #fff;
                  -moz-border-radius: 12px;
                  -webkit-border-radius: 12px;
                  border-radius: 12px;}
          .teammodo{
          border-top: 1px solid #005B89;
          border-bottom: 1px solid #005B89;
          margin: 0px;
          color: #FF9900;
          font-family:: cursive;
          text-shadow: 0px 0px 1px #000;
          }
          .membreslfu{
          border-top: 1px solid #005B89;
          border-bottom: 1px solid #005B89;
          color: #82c3ff;
          font-family:: cursive;
          text-postiton: center;
          text-shadow: 0px 0px 1px #000;
          margin: 0px;
          }
          .teamadmin:hover{
          color: #FF0000;
          border-radius: 5px;
          font-family:: cursive;
          background-color: #095279;
          position: center;
          text-shadow: 0px 0px 1px #000;
          border-top: 2px solid #005B89;
          border-bottom: 1px solid #005B89;
           transition: 1s;
           -moz-transition: 1s;
           -o-transition: 1s;
           -htm-transition: 1s;
           -webkit-transition: 1s;
          margin: 0px;
          }
          .teammodo:hover{
           border-radius: 5px;
          color: #FF9900;
          font-family:: cursive;
          text-shadow: 0px 0px 1px #000;
          background-color: #095279;
          position: center;
          border-top: 2px solid #005B89;
          border-bottom: 1px solid #005B89;
           transition: 1s;
           -moz-transition: 1s;
           -o-transition: 1s;
           -htm-transition: 1s;
           -webkit-transition: 1s;
          margin: 0px;
          }
          .membreslfu:hover{
           border-radius: 5px;
          color: #82c3ff;
          font-family:: cursive;
          text-shadow: 0px 0px 1px #000;
          background-color: #095279;
          position: center;
          border-top: 2px solid #005B89;
          border-bottom: 1px solid #005B89;
          transition: 1s;
          -moz-transition: 1s;
          -o-transition: 1s;
          -htm-transition: 1s;
          -webkit-transition: 1s;
          margin: 0px;
          }
          .teampartenaire{
          border-top: 1px solid #005B89;
          border-bottom: 1px solid #005B89;
          color: #fffb00;
          font-family:: cursive;
          text-shadow: 0px 0px 1px #000;
          margin: 0px;
          }
          .teampartenaire:hover{
          color: #fffb00;
          border-radius: 5px;
          font-family:: cursive;
          background-color: #095279;
          position: center;
          text-shadow: 0px 0px 1px #000;
          border-top: 2px solid #005B89;
          border-bottom: 1px solid #005B89;
           transition: 1s;
           -moz-transition: 1s;
           -o-transition: 1s;
           -htm-transition: 1s;
           -webkit-transition: 1s;
          margin: 0px;
          }
          .teamvoyageur{
          border-top: 1px solid #005B89;
          border-bottom: 1px solid #005B89;
          color: #c800ff;
          font-family:: cursive;
          text-shadow: 0px 0px 1px #000;
          margin: 0px;
          }
          .teamvoyageur:hover{
          color: #c800ff;
          border-radius: 5px;
          font-family:: cursive;
          background-color: #095279;
          position: center;
          text-shadow: 0px 0px 1px #000;
          border-top: 2px solid #005B89;
          border-bottom: 1px solid #005B89;
           transition: 1s;
           -moz-transition: 1s;
           -o-transition: 1s;
           -htm-transition: 1s;
           -webkit-transition: 1s;
          margin: 0px;
          }
          .teampnj{
          border-top: 1px solid #005B89;
          border-bottom: 1px solid #005B89;
          color: #ffffff;
          font-family:: cursive;
          text-shadow: 0px 0px 1px #000;
          margin: 0px;
          }
          .teampnj:hover{
          color: #ffffff;
          border-radius: 5px;
          font-family:: cursive;
          background-color: #095279;
          position: center;
          text-shadow: 0px 0px 1px #000;
          border-top: 2px solid #005B89;
          border-bottom: 1px solid #005B89;
           transition: 1s;
           -moz-transition: 1s;
           -o-transition: 1s;
           -htm-transition: 1s;
           -webkit-transition: 1s;
          margin: 0px;
          }
          .boxqeel2 {
          background-color : #003B59;
          border : 1px solid #005B89;
          border-radius: 5px;
          border-top : 3px solid #005B89;
          padding : 5px;
          height: 190px;
          font-size:12px;
          width: 185px;
          margin-top:7px;
          }
          .groupeqeel {
          background-color : #003B59;
          border : 1px solid #005B89;
          border-radius: 5px;
          border-top : 3px solid #005B89;
          padding : 5px;
          width: 895px;
          margin-top:5px;
          }
          .qeeltable {
          background-color : #003B59;
          border : 1px solid #005B89;
          border-radius: 5px;
          border-top : 3px solid #005B89;
          padding : 5px;
          box-shadow: 0px 0px 2px #000000;
          /*width: 905px;*/
          }


    Et voila votre QEEL est installé :)
    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
    Fyraliel
    FémininAge : 27Messages : 1424

    le Dim 20 Juil 2014 - 22:15

    merci



    avatar
    alex24d
    FémininAge : 30Messages : 95

    le Mar 22 Juil 2014 - 15:22

    merci
    Conradus
    FémininAge : 19Messages : 26

    le Mar 22 Juil 2014 - 15:56

    Merci
    avatar
    Venise
    FémininAge : 34Messages : 270

    le Mer 23 Juil 2014 - 14:06

    pour voir, merci
    avatar
    patriciadpt30
    FémininAge : 55Messages : 240

    le Mer 30 Juil 2014 - 12:01

    Merci c'est super comme toujours  Wink 



    Patricia :)
    avatar
    Elora Hanta
    FémininAge : 26Messages : 69

    le Jeu 14 Aoû 2014 - 11:45

    Merci
    N'Eris
    MasculinAge : 29Messages : 19

    le Sam 16 Aoû 2014 - 17:46

    Merci.
    avatar
    Airore
    FémininAge : 19Messages : 132

    le Lun 18 Aoû 2014 - 16:19

    merci.
    avatar
    Caine Lornan
    MasculinAge : 37Messages : 78

    le Mer 27 Aoû 2014 - 11:29

    Merci
    avatar
    Kiwii
    FémininAge : 20Messages : 57

    le Jeu 28 Aoû 2014 - 18:07

    Merci !
    avatar
    Pokebip
    MasculinAge : 20Messages : 69

    le Jeu 4 Sep 2014 - 18:01

    merci
    avatar
    Cydae
    FémininAge : 25Messages : 99

    le Dim 7 Sep 2014 - 0:39

    Merci!
    avatar
    Glow
    FémininAge : 18Messages : 93

    le Dim 7 Sep 2014 - 14:02

    Gracias C:
    avatar
    Aile de l'Ange
    FémininAge : 20Messages : 110

    le Jeu 25 Sep 2014 - 15:25

    Il est bien fait...
    avatar
    Mangédéfruiélégumeuh
    MasculinAge : 21Messages : 83

    le Sam 27 Sep 2014 - 23:01

    Merci :)
    avatar
    lala zhang
    FémininAge : 27Messages : 345

    le Dim 28 Sep 2014 - 14:34

    Merci pour le partage elle est super et pratique je trouve
    avatar
    AsHElsa
    FémininAge : 24Messages : 53

    le Sam 11 Oct 2014 - 11:52

    Merci pour le partage =)
    avatar
    picka234
    Age : 53Messages : 440

    le Mar 14 Oct 2014 - 21:12

    merci!!!!



    avatar
    Acédie
    FémininAge : 19Messages : 91

    le Ven 24 Oct 2014 - 14:02

    Merci :)
    avatar
    Nonze
    MasculinAge : 24Messages : 85

    le Dim 2 Nov 2014 - 1:07

    Merci
    avatar
    Hanako-chan
    FémininAge : 17Messages : 33

    le Dim 2 Nov 2014 - 14:18

    Merci beaucoup ça m'a bien aidée ! =D
    avatar
    Loukoum
    FémininAge : 24Messages : 835

    le Jeu 27 Nov 2014 - 8:45

    Merci pour la partage!



    avatar
    Lilith Aube
    FémininAge : 31Messages : 483

    le Sam 29 Nov 2014 - 12:06

    merci =)
    avatar
    Clémentine
    FémininAge : 25Messages : 223

    le Dim 30 Nov 2014 - 23:19

    Merci ~ ^^



    avatar
    Natsu892
    MasculinAge : 17Messages : 63

    le Mer 3 Déc 2014 - 15:02

    merci



    Contenu sponsorisé


      La date/heure actuelle est Dim 27 Mai 2018 - 17:43