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 Pink & Gray

    Partagez
    avatar
    A-Lice
    FémininAge : 23Messages : 4939

    le Sam 19 Juil 2014 - 3:48

    Rappel du premier message :


    Qeel Pink & Gray


    Suite à une demande de Javarakita voici un Qeel Pink & Gray.

    Je précise que l'arrière plan beige correspond à mon forum.

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


    Et le code :
    Il faut remplacer cette partie du 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 -->

    Par celle-ci :
    Code:
    <!-- BEGIN disable_viewonline -->
    <link href='http://fonts.googleapis.com/css?family=Playball' rel='stylesheet' type='text/css'><div id="qeel_fond"><div id="qeel_img"></div><div class="titre_qeel">Que se passe-t-il à Canberra ?</div>
    <table id="qeel_position">
      <tr>
        <td class="qeel_colonne1"><span id="nb_messages">{TOTAL_POSTS}<script type="text/javascript">document.getElementById('nb_messages').innerHTML=document.getElementById('nb_messages').innerHTML.replace(/messages/,"aventures se sont passées à Canberra.");
    document.getElementById('nb_messages').innerHTML=document.getElementById('nb_messages').innerHTML.replace(/Nos membres ont posté un total de/," ");</script></span><br />
          <span id="nb_membres">{TOTAL_USERS}<script type="text/javascript">document.getElementById('nb_membres').innerHTML=document.getElementById('nb_membres').innerHTML.replace(/Nous avons/,"Il y a eu");
    document.getElementById('nb_membres').innerHTML=document.getElementById('nb_membres').innerHTML.replace(/membres enregistrés/,"déménagements depuis le début.");
    document.getElementById('nb_membres').innerHTML=document.getElementById('nb_membres').innerHTML.replace(/membre enregistré/,"déménagement depuis le début.");</script></span><br />
          <span id="new_user">{NEWEST_USER}<script type="text/javascript">document.getElementById('new_user').innerHTML=document.getElementById('new_user').innerHTML.replace(/L'utilisateur enregistré le plus récent est/,"Le petit dernier à avoir emménager est");</script></span><br /><br/>
        <span id="tot_user">{TOTAL_USERS_ONLINE}<script type="text/javascript">document.getElementById('tot_user').innerHTML=document.getElementById('tot_user').innerHTML.replace(/Il y a en tout/,"Il y a");
    document.getElementById('tot_user').innerHTML=document.getElementById('tot_user').innerHTML.replace(/utilisateurs en ligne/,"personnes près de Canberra en ce moment même");
    document.getElementById('tot_user').innerHTML=document.getElementById('tot_user').innerHTML.replace(/utilisateur en ligne/,"personne près de Canberra en ce moment même");
    document.getElementById('tot_user').innerHTML=document.getElementById('tot_user').innerHTML.replace(/Enregistrés/,"habitants");
    document.getElementById('tot_user').innerHTML=document.getElementById('tot_user').innerHTML.replace(/Enregistré/,"habitant");
    document.getElementById('tot_user').innerHTML=document.getElementById('tot_user').innerHTML.replace(/Invisibles/,"inconnus au bataillon");
    document.getElementById('tot_user').innerHTML=document.getElementById('tot_user').innerHTML.replace(/Invisible/,"inconnu au bataillon");
    document.getElementById('tot_user').innerHTML=document.getElementById('tot_user').innerHTML.replace(/Invités/,"touristes qui hésitent à s'installer")
     document.getElementById('tot_user').innerHTML=document.getElementById('tot_user').innerHTML.replace(/Invité/,"touriste qui hésite à s'installer");</script></span><br />
          {RECORD_USERS}<br />
          <br />
          <span id="logged">{LOGGED_IN_USER_LIST}<script type="text/javascript">document.getElementById('logged').innerHTML=document.getElementById('logged').innerHTML.replace(/Utilisateurs enregistrés :/,"Les actifs présents sont");</script></span><br />
    </td>
    <td width="20px;"></td>
    <td class="qeel_colonne2">
    <script type="text/javascript">
            //<!--
                    function change_onglet(bouya)
                    {
                            document.getElementById('onglet_'+anc_onglet).className = 'onglet_0 onglet';
                            document.getElementById('onglet_'+bouya).className = 'onglet_1 onglet';
                            document.getElementById('contenu_onglet_'+anc_onglet).style.display = 'none';
                            document.getElementById('contenu_onglet_'+bouya).style.display = 'block';
                            anc_onglet = bouya;
                    }
            //-->
    </script><span class="onglet_0 onglet" id="onglet_un" onmouseover="javascript:change_onglet('un');">Kapou</span><span class="onglet_0 onglet" id="onglet_deux" onmouseover="javascript:change_onglet('deux');">Bibiche</span><span class="onglet_0 onglet" id="onglet_trois" onmouseover="javascript:change_onglet('trois');">Yankee</span>
    <div class="contenu_onglet" id="contenu_onglet_un">
        Contenu du 1er onglet
    </div>
    <div class="contenu_onglet" id="contenu_onglet_deux">
        Contenu du 2ième onglet
    </div>
    <div class="contenu_onglet" id="contenu_onglet_trois">
        Contenu du 3ième onglet
    </div><script type="text/javascript">
            //<!--
                    var anc_onglet = 'un';
                    change_onglet(anc_onglet);
            //-->
      </script>
    </td>
    <td width="20px;"></td>
        <td class="qeel_colonne1"><table class="transparent">{L_CONNECTED_MEMBERS}
      {L_WHOSBIRTHDAY_TODAY}
      {L_WHOSBIRTHDAY_WEEK}</table>
    </td>
      </tr>
    </table>
    </div>
    <!-- END disable_viewonline -->


    CSS :
    Code:
    .titre_qeel {
    font-size:40px;
    color:crimson;
    text-align:center;
    display:block;
    margin-top:-30px;
    font-family: 'Playball', cursive;
    }
    .transparent .row1 {
    background-color: transparent;
    }
    .transparent .gensmall {
    font-size:12px;
    }
    /*onglets*/
    .onglet {
    background:white;
    padding:2px;
    margin-right:3px;
    }

    .onglet_0 {
    background:whitesmoke;
    }

    .onglet_1 {
    background:white;
    }

    #onglet_un {
    color:cyan;
    }

    #onglet_deux {
    color:pink;
    }

    #onglet_trois {
    color:silver;
    }

    .contenu_onglet {
    display:none;
    padding:10px;
    height:120px;
    text-align:justify;
    }

    #contenu_onglet_un {
    font-size:13px;
    }

    #contenu_onglet_deux{
    font-size:13px;
    }

    #contenu_onglet_trois {
    font-size:13px;
    }
    /*fin onglets*/

    #qeel_fond {
    background:whitesmoke;
    }

    #qeel_img {
    height:63px;
    background-image:url(http://upz.fr/Ueim1.png);
    }

    #qeel_position {
    position: relative;
    padding:10px;
    }

    .qeel_colonne1 {
    font-size: 12px;
    text-align: justify;
    width: 35%;
    height: 150px;
    overflow: auto;
    background:pink;
    padding:10px;
    }

    .qeel_colonne2 {
    width: 25%;
    height: 150px;
    overflow: auto;
    background:pink;
    padding:10px;
    text-align:center;
    }


    La suite de l'ensemble se trouve ici :


    PA Pink & Gray
    Catégories
    Qeel

    /!\ En cas de problème, c'est ici que ça ce passe.


    Dernière édition par A-Lice le Mar 17 Fév 2015 - 15:26, édité 2 fois

    avatar
    Kirito
    MasculinAge : 21Messages : 199

    le Dim 13 Mar 2016 - 20:12

    Merci !!!
    avatar
    Dreamyland
    FémininAge : 20Messages : 87

    le Jeu 31 Mar 2016 - 23:41

    Merci
    avatar
    Margaux E.
    FémininAge : 14Messages : 25

    le Lun 4 Avr 2016 - 19:57

    Thanks you !
    avatar
    Hana Evali
    FémininAge : 27Messages : 164

    le Lun 16 Mai 2016 - 22:41

    merci !



    avatar
    Amecia
    FémininAge : 20Messages : 105

    le Lun 6 Juin 2016 - 23:24

    Merci :)



    avatar
    didicmy
    FémininAge : 26Messages : 68

    le Mar 7 Juin 2016 - 17:29

    Voyons voir ce que ça donne :) Merci du partage Wink
    avatar
    cali60
    FémininAge : 32Messages : 58

    le Jeu 16 Juin 2016 - 9:36

    :) :)
    avatar
    Plùmyts
    FémininAge : 21Messages : 15

    le Ven 8 Juil 2016 - 10:41

    Merci ! cheers
    avatar
    ArcadeFire
    FémininAge : 22Messages : 13

    le Mer 20 Juil 2016 - 10:48

    Merci !
    avatar
    Valou712
    FémininAge : 34Messages : 23

    le Jeu 21 Juil 2016 - 7:56

    Très joli travail !! Merci !!
    avatar
    céleste callisto
    FémininAge : 25Messages : 40

    le Dim 31 Juil 2016 - 13:07

    Merci
    avatar
    Zekarant
    MasculinAge : 16Messages : 51

    le Mar 9 Aoû 2016 - 16:18

    Merci du partage !
    avatar
    HazelW
    FémininAge : 24Messages : 45

    le Ven 12 Aoû 2016 - 11:57

    Merci !



    avatar
    missmarie
    FémininAge : 26Messages : 21

    le Mar 23 Aoû 2016 - 20:56

    merci ♥
    avatar
    Samiki
    FémininAge : 19Messages : 84

    le Ven 26 Aoû 2016 - 15:27

    Merciii




    Dakeris RPG ♦ Un monde nouveau régi par la peur
    Le forum ouvre ses portes, nous vous attendons nombreux !

    avatar
    Angy38
    FémininAge : 47Messages : 207

    le Ven 26 Aoû 2016 - 23:25

    Merci



    avatar
    LOUVE ☽
    FémininAge : 27Messages : 53

    le Dim 28 Aoû 2016 - 1:24

    MERCI :love: :love: :love:
    avatar
    Insane.
    FémininAge : 19Messages : 53

    le Lun 29 Aoû 2016 - 16:32

    Merci du partage, j'aime beaucoup !
    avatar
    LickingBoot
    FémininAge : 18Messages : 495

    le Mar 30 Aoû 2016 - 10:40

    merci =)



    avatar
    Saphira
    FémininAge : 21Messages : 72

    le Mar 30 Aoû 2016 - 22:58

    merci
    avatar
    Shivichou
    FémininAge : 21Messages : 20

    le Jeu 1 Sep 2016 - 15:13

    Sympa ! ^^ Merciii !!
    avatar
    Presley♥Cash
    FémininAge : 26Messages : 73

    le Ven 16 Sep 2016 - 19:38

    Merci ♥
    avatar
    Bryan1997
    MasculinAge : 20Messages : 51

    le Mer 26 Oct 2016 - 15:31

    merci
    avatar
    Invité

    le Dim 30 Oct 2016 - 14:48

    merci :)
    avatar
    Rebekaah
    FémininAge : 22Messages : 49

    le Mar 1 Nov 2016 - 20:45

    Merci, merci !
    Contenu sponsorisé


      La date/heure actuelle est Jeu 17 Aoû 2017 - 7:49