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 plusieurs bulles

    Partagez
    avatar
    Halloween
    FémininAge : 24Messages : 9751

    le Ven 13 Sep 2013 - 18:16

    Rappel du premier message :


      Hey,

      Comme toujours petit aperçu du résultat du code : Ma maman fait des cookies.
      Bien évidemment il faut toucher aux templates, ce qui signifie qu'il faut se connecter avec le compte fondateur, sinon on est dans la mouise :siffle: Les couleurs sont personnalisables, la police aussi ... bref rien ne change.

      Les codes:
      A placer dans le CSS :
      Code:
      /* QEEL */

      .trans .row1 {
      background-color: #CDCCC8;
      }

      .titreqeel {
        color: #2E3454;
        font-family: 'Finger Paint', cursive;
        font-size: 45px;
        text-align: center;
      }

      .cadreqeel {
        background-color: #CDCCC8;
        color: #5C5C5C;
        padding: 15px;
        width: 210px;
        height: 190px;
        text-align: justify;
        font-family: arial;
        font-size: 10px;
        -moz-border-radius: 310px;
        -webkit-border-radius: 310px;
        border-radius: 310px;
      }

      .cadreqeel1 {
        background-color: #CDCCC8;
        color: #5C5C5C;
        padding: 15px;
        width: 210px;
        height: 190px;
        text-align: justify;
        font-family: arial;
        font-size: 10px;
        -moz-border-radius: 310px;
        -webkit-border-radius: 310px;
        border-radius: 310px;
      }

      .cadreqeel2 {
        background-color: #CDCCC8;
        color: #5C5C5C;
        padding: 15px;
        width: 500px;
        height: 100px;
        overflow: auto;
        text-align: justify;
        font-family: arial;
        font-size: 10px;
        -moz-border-radius: 50px;
        -webkit-border-radius: 50px;
        border-radius: 50px;
      }

      .boite10 {
        margin-left: 20px;
        margin-top: 25px;
        width: 180px;
        height: 180px;
        overflow: auto;
      }

      .groupes {
        font-family: 'Gabriela', serif;
        text-align: center !important;
        font-size: 20px;
      }
      Repérez ceci dans le template "index_body" :
      Code:
      <!-- BEGIN disable_viewonline -->
      <table class="forumline" width="100%" border="0" cellspacing="1" cellpadding="0">
       <tr>
       <td class="catHead" colspan="2" height="28">
       <!-- BEGIN switch_viewonline_link -->
       <span class="cattitle"><a class="cattitle" href="{U_VIEWONLINE}" rel="nofollow">{L_WHO_IS_ONLINE}</a></span>
       <!-- END switch_viewonline_link -->

       <!-- BEGIN switch_viewonline_nolink -->
       <span class="cattitle">{L_WHO_IS_ONLINE}</span>
       <!-- END switch_viewonline_nolink -->
       </td>
       </tr>
       <tr>
       <td class="row1" rowspan="6" align="center" valign="middle"><img src="{L_ONLINE_IMG}" id="i_whosonline" alt="{L_WHO_IS_ONLINE}" /></td>
       <td class="row1" width="100%"><span class="gensmall">{TOTAL_POSTS}<br />
       {TOTAL_USERS}<br />
       {NEWEST_USER}</span></td>
       </tr>
       <tr>
       <td class="row1"><span class="gensmall">{TOTAL_USERS_ONLINE}<br />
       {RECORD_USERS}<br />
       <br />
       {LOGGED_IN_USER_LIST}</span></td>
       </tr>
       {L_CONNECTED_MEMBERS}
       {L_WHOSBIRTHDAY_TODAY}
       {L_WHOSBIRTHDAY_WEEK}
       <tr>
       <td class="row1"><span class="gensmall">{LEGEND} : {GROUP_LEGEND}</span></td>
       </tr>
       <!-- BEGIN switch_chatbox_activate -->
       <tr>
       <td class="row1">
       <span class="gensmall">{TOTAL_CHATTERS_ONLINE} :&nbsp; {CHATTERS_LIST}<br />
       <!-- BEGIN switch_chatbox_popup -->
       <div id="chatbox_popup"></div>
       <script type="text/javascript">
       //<![CDATA[
       insertChatBoxPopup('{disable_viewonline.switch_chatbox_activate.switch_chatbox_popup.U_FRAME_CHATBOX}', '{L_CLICK_TO_JOIN_CHAT}');
       //]]>
       </script>
       <!-- END switch_chatbox_popup -->
       </span>
       </td>
       </tr>
       <!-- END switch_chatbox_activate -->
      </table>
      <!-- END disable_viewonline -->
      Que vous remplacez par :
      Code:
      <!-- BEGIN disable_viewonline -->
       
      <center><table class="forumline" width="100%" border="0" cellspacing="0" cellpadding="0"><div style="width: 700px;">

              <div class="titreqeel">Qui est en ligne ?</div>
        <br />
        <tr><nobr><div class="groupes"><center>
          <font color="#988DA1">Groupe 1</font> <font color="#71B368">Groupe 2</font> <font color="#268FB5">Groupe 3</font> <font color="#C26969">Groupe 4</font></center></div>
          </nobr></tr>
            
               <tr>
                  <td><div class="cadreqeel" style="margin-left: 20px;"><div class="boite10" style="margin-left: 20px;">{TOTAL_POSTS}<br />
            {TOTAL_USERS}<br />
            {NEWEST_USER}<br />
                      {TOTAL_USERS_ONLINE}<br />
            {RECORD_USERS}<br />
                    </div></div></td>
                  <td><img src="http://i35.servimg.com/u/f35/16/61/97/52/2210.png" class="imgqeel"/></td>
                  <td><div class="cadreqeel1"><div class="boite10">{LOGGED_IN_USER_LIST}</div></div></td>
                  </tr>
        <br />
       <table class="trans" style="margin-top: 20px; background-color: #CDCCC8; color: #CDDAF5; padding: 15px; width: 500px; height: 70px; overflow: auto;
      text-align: justify; font-family: arial; font-size: 10px; -moz-border-radius: 50px;  -webkit-border-radius: 50px; border-radius: 50px; margin-top: -1px;"><div class="cadreqeel12">{L_CONNECTED_MEMBERS}</div></table>
        <br /><a href="http://www.never-utopia.com" style="color: #918E86 !important; font-size: 9px; font-family: arial;">© By Halloween sur Never Utopia</a>
       
       </div></table></center>
      <!-- END disable_viewonline -->
      Pour ceux qui souhaitent obtenir les mêmes polices que sur le schéma, il faut ajouter ce qui va suivre tout à la fin du template :
      Code:
      <link href='http://fonts.googleapis.com/css?family=Finger+Paint' rel='stylesheet' type='text/css'>
      <link href='http://fonts.googleapis.com/css?family=Gabriela' rel='stylesheet' type='text/css'>
      Ou d'autres liens selon la police google font choisie (si vous choisissez une police "classique" (arial, verdana etc ...) ce n'est pas nécessaire.

      Pensez à vous présenter et à dire merci pour vous servir. En cas de problème vous aurez une réponse plus rapide ici qu'en postant à la suite.
      Le crédit est indélébile please \o/


    Dernière édition par Halloween le Dim 15 Sep 2013 - 16:29, édité 1 fois




    < / Libre service codage >
    Shauna G. Sakihata
    FémininAge : 24Messages : 12

    le Mer 13 Juil 2016 - 17:44

    Merci Beaucoup !
    avatar
    Mr Kent
    MasculinAge : 23Messages : 23

    le Mer 13 Juil 2016 - 21:08

    Merci :)
    avatar
    Jessabelle
    FémininAge : 24Messages : 109

    le Sam 23 Juil 2016 - 7:40

    Superbe code merci du partage :)
    avatar
    Célestine
    FémininAge : 20Messages : 51

    le Mar 26 Juil 2016 - 4:14

    Merci !!
    céleste callisto
    FémininAge : 26Messages : 54

    le Ven 5 Aoû 2016 - 22:14

    Merci
    avatar
    LegendsOfToday
    FémininAge : 22Messages : 78

    le Ven 19 Aoû 2016 - 21:21

    Merci !
    avatar
    Clémentine
    FémininAge : 25Messages : 223

    le Mar 23 Aoû 2016 - 19:03

    Merciiii **



    avatar
    Kiona_Spencer
    FémininAge : 27Messages : 27

    le Mer 24 Aoû 2016 - 18:41

    Ce QEEL est vraiment beau, merci pour ce partage :)
    avatar
    La Tour Fantôme
    MasculinAge : 25Messages : 74

    le Sam 24 Sep 2016 - 7:52

    Merci ! Juste signaler un petit truc qui me chiffonnes ... dans le template, le dernier bulle se nomme cadreqeel12 mais dans le CSS, il n'y a pas ça, il y a seulement un cadreqeel2. Et du coup je n'arrive pas à modifier la taille de la police du dernier petit bulle avec les derniers connectés des 24 heures. Peux tu voir si tu peux arranger ça ?
    avatar
    KimmyKinder
    FémininAge : 16Messages : 181

    le Mar 4 Oct 2016 - 18:00

    Merci
    avatar
    SuperSpaceCab
    MasculinAge : 33Messages : 36

    le Mer 5 Oct 2016 - 6:48

    Cool merci
    avatar
    Jynnea
    FémininAge : 23Messages : 103

    le Ven 7 Oct 2016 - 8:50

    Merci!
    avatar
    ajmm
    FémininAge : 29Messages : 14

    le Mer 12 Oct 2016 - 16:20

    Superbe! Merci !
    avatar
    Discorde
    FémininAge : 17Messages : 58

    le Sam 22 Oct 2016 - 21:49

    Thanks !
    avatar
    Bryan1997
    MasculinAge : 21Messages : 51

    le Dim 23 Oct 2016 - 17:18

    merci
    avatar
    Lucrécya
    FémininAge : 25Messages : 38

    le Jeu 27 Oct 2016 - 16:18

    Thanks !
    avatar
    Lovelymp
    FémininAge : 38Messages : 58

    le Ven 18 Nov 2016 - 8:56

    Merci du qeel
    avatar
    Rosalie Hale
    FémininAge : 24Messages : 185

    le Sam 26 Nov 2016 - 14:33

    Merci :)
    avatar
    Scratpub
    FémininAge : 29Messages : 73

    le Dim 27 Nov 2016 - 22:29

    Super merci !
    avatar
    Loona
    FémininAge : 51Messages : 21

    le Jeu 8 Déc 2016 - 14:29

    Merci beaucoup.



    avatar
    Orochimaru
    FémininAge : 27Messages : 205

    le Sam 10 Déc 2016 - 2:29

      Très joli & Beau travail Very Happy
      Merci du partage (:



    Orochimaru

    " Les proies doivent toujours faire preuve de la plus grande vigilance, lorsqu'elles tentent d'échapper à leur prédateur. Tout ce qu'une proie peut espérer de son prédateur, c'est qu'il daigne la laisser tranquille après avoir eu ce qu'il voulait."
    avatar
    Océ
    FémininAge : 43Messages : 280

    le Sam 10 Déc 2016 - 13:06

    Merci beaucoup



    Bonjours voici les pv's que nous cherchons : [url=http://www.never-utopia.com/t63181-les-postes-vacants-pour-les-chronuque-de-aya#960582 L’annonce est ici[/url]
    avatar
    Tinkky
    FémininAge : 27Messages : 89

    le Mar 13 Déc 2016 - 21:03

    Vraiment jolie. Merci du partage ^_^
    avatar
    Zuiichi
    MasculinAge : 24Messages : 119

    le Mar 13 Déc 2016 - 21:22

    Il est super génial j'adore merci pour le partage =)



    avatar
    Mistiie
    FémininAge : 19Messages : 74

    le Jeu 22 Déc 2016 - 14:48

    Merci
    Contenu sponsorisé


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