Bouh!

J'ai un coup de coeur pour ton qeel, alors je le ferai dans la soirée ^^

Juste un petit quelque chose... Dans ton carré en haut, tu veux mettre quoi exactement? Parce qu'il y a beaucoup d'informations qui peuvent y rentrer :

- Nombre de messages
- Nombre de membres inscrits
- Record du nombre d'utilisateurs
- Nombre de personnes présents sur le forum
- Membres connectés sur le forum
- Membres connectés au cours des 24/48/72 dernières heures
- Dernier membre inscrit
- Membres ayant leur anniversaire aujourd'hui
- Membres ayant leur anniversaire au cours des 7 prochains jours
- Membres connectés sur la CB

Donc, voilà, à toi de me dire ce que tu veux mettre ou ne pas mettre


Edit:
Eh bien voilà mon premier essai http://forum-test-onyx5.forum-canada.com/
D'ailleurs, je ne t'ai pas demandé la police à utiliser dans le carré en haut, donc c'est laquelle?

HAAAAN J'ai failli tomber de mon lit en voyant que tu étais passée! Merci beaucoup pour ton aide précieuse! <333
J'adore le petit effet subtil de la transparence quand on passe le curseur sur les groupes *__*

Quand au texte, Arial 11px je crois que ça fera l'affaire! Quant aux infos je verrai bien juste celles-ci:
- Nombre de messages
- Nombre de membres inscrits
- Record du nombre d'utilisateurs
- Nombre de personnes présents sur le forum
- Membres connectés sur le forum
- Membres connectés au cours des 24/48/72 dernières heures
- Dernier membre inscrit

Merci ^^

Bon, tout devrait y être http://forum-test-onyx5.forum-canada.com/

Commentaires/critiques/demandes?
(ça fait pas un peu petit 11px?)

PS: Et je m'en vais me coucher, alors à demain matin ^^

Je me jette à tes pieds là. Franchement, un grand merci pour ton aide si précieuse, c'est exactement ce que je voulais!
La taille j'allais la garder (peut-être mettrais-je un peu plus d'espace entre les lettres?), pac'que je vais essayer de personnaliser le texte des statistiques pour que ça fasse plus sympathique :) Petite question: peux-tu juste mettre les numéros des statistiques (le chiffre du nombre de messages, le chiffre du nombre de membres, membres online, invités etc) en gras? Désolé je ne l'ai pas précisé *o*

Voilà, un petit espace entre les lettres. Pour les chiffres, j'ai mis du gras, mais on ne voyait pas la différence, alors je l'ai aussi mis en italique. Bref : http://forum-test-onyx5.forum-canada.com/

Oh grand merci! C'est parfait! <3

Si tout est bon, je te donne les codes ^^

CSS:

Code:

/************************************************************ DÉBUT QEEL ************************************************************/

/*Fond du qeel*/
#qeel {
  position: relative;
  width: 797px;
  height: 681px;
  margin: auto;
  background-image: url('http://image.noelshack.com/fichiers/2014/47/1416355134-bg-sans-les-groupes.png');
}

/*Carré des informations sur les membres*/
#qeel_info_members {
  position: absolute;
  top: 28px;
  left: 37px;
  width: 340px;
  height: 230px;
  color: #c9c7be;
  font-size: 11px;
  font-family: arial;
  letter-spacing: 1px;
  text-align: left;
}

/*Mise en forme des listes des membres connectés*/
#userlists {
  margin-top: 5px;
  height: 150px;
  overflow: auto;
}
#totalconn {
  margin-top: 5px;
}
#totalconn .row1{
  background: transparent;
  vertical-align: top;
}
#totalconn .gensmall {
  color: #c9c7be;
  font-size: 11px;
  font-family: arial;
  letter-spacing: 1px;
  text-align: left;
}


/*Section des groupes*/
#qeel_bottom {
  position: absolute;
  bottom: 30px;
  left: 12px;
  width: 773px;
  height: 254px;
  text-align: center; 
}

/*Nom des groupes*/
.qeelonglet {
  opacity: 0.6;
}
/*Groupe au survol*/
.qeelonglet_0:hover {
  cursor: pointer;
  opacity: 0.9;
}
/*Groupe actif*/
.qeelonglet_1 {
  opacity: 1;
}
/*Pour aligner l'onglet Deserteurs*/
#qeelonglet_Deserteurs {
  position: relative;
  top: 5px;
}

/*Images de description des groupes*/
.contenu_qeelonglet {
  width: 773px;
  height: 171px;
  margin-top: 7px;
  display: none;
}

/************************************************************ FIN QEEL ************************************************************/

Template Index_box, à mettre entre le "BEGIN disable_viewonline" et le "END disable_viewonline", inclusivement :

Code:

<!-- BEGIN disable_viewonline -->
<div id="qeel">
 
  <div id="qeel_info_members">
    <span id="totaluser">{TOTAL_USERS}</span>
    <span id="totalpost">{TOTAL_POSTS}</span> et
    <span id="newuser">{NEWEST_USER}</span>.
    <span id="recorduser">{RECORD_USERS}</span>.
    <span id="totalonline">{TOTAL_USERS_ONLINE}</span>.<br />
    <div id="userlists">
      <div id="loggedlist">{LOGGED_IN_USER_LIST}</div>
      <div  id="totalconn"><table cellspacing="0" cellpadding="0">{L_CONNECTED_MEMBERS}</table></div>
    </div>
   
    <script type="text/javascript">
      document.getElementById('totaluser').innerHTML=document.getElementById('totaluser').innerHTML.replace(/Nous avons/,"Nos<b><i>");
      document.getElementById('totaluser').innerHTML=document.getElementById('totaluser').innerHTML.replace(/membre enregistré/,"</i></b>membre");
      document.getElementById('totaluser').innerHTML=document.getElementById('totaluser').innerHTML.replace(/membres enregistrés/,"</i></b>membres");
      document.getElementById('totalpost').innerHTML=document.getElementById('totalpost').innerHTML.replace(/Nos membres ont posté un total de/,"qui ont posté un total de<b><i>");
      document.getElementById('totalpost').innerHTML=document.getElementById('totalpost').innerHTML.replace(/message/,"</i></b>message.");
      document.getElementById('totalpost').innerHTML=document.getElementById('totalpost').innerHTML.replace(/messages/,"</i></b>messages.");
      document.getElementById('newuser').innerHTML=document.getElementById('newuser').innerHTML.replace(/L'utilisateur enregistré le plus récent est/,"notre dernière recrue est");
      document.getElementById('loggedlist').innerHTML=document.getElementById('loggedlist').innerHTML.replace(/Utilisateurs enregistrés/,"Membres connectés");
      document.getElementById('recorduser').innerHTML=document.getElementById('recorduser').innerHTML.replace(/Le record du nombre d'utilisateurs en ligne est de/,"Notre record d'utilisateurs en ligne est de<b><i>");
      document.getElementById('recorduser').innerHTML=document.getElementById('recorduser').innerHTML.replace(/le/,"</i></b>le");
      document.getElementById('totalonline').innerHTML=document.getElementById('totalonline').innerHTML.replace(/Il y a en tout/,"Présentement, il y a<b><i>");
      document.getElementById('totalonline').innerHTML=document.getElementById('totalonline').innerHTML.replace(/utilisateur en ligne ::/,"</i></b>utilisateur en ligne :<b><i>");
      document.getElementById('totalonline').innerHTML=document.getElementById('totalonline').innerHTML.replace(/utilisateurs en ligne ::/,"</i></b>utilisateurs en ligne :<b><i>");
      document.getElementById('totalonline').innerHTML=document.getElementById('totalonline').innerHTML.replace(/Enregistré/,"</i></b>membre<b><i>");
      document.getElementById('totalonline').innerHTML=document.getElementById('totalonline').innerHTML.replace(/Enregistrés/,"</i></b>membres<b><i>");
      document.getElementById('totalonline').innerHTML=document.getElementById('totalonline').innerHTML.replace(/Invisible/,"</i></b>invisible<b><i>");
      document.getElementById('totalonline').innerHTML=document.getElementById('totalonline').innerHTML.replace(/Invisibles/,"</i></b>invisibles<b><i>");
      document.getElementById('totalonline').innerHTML=document.getElementById('totalonline').innerHTML.replace(/Invité /,"</i></b>passant<b><i>");
      document.getElementById('totalonline').innerHTML=document.getElementById('totalonline').innerHTML.replace(/Invités /,"</i></b>passants");
    </script>
  </div>
 
  <div id="qeel_bottom">
   
    <script type="text/javascript">
        //<!--
                function change_qeelonglet(name)
                {
                        document.getElementById('qeelonglet_'+anc_qeelonglet).className = 'qeelonglet_0 qeelonglet';
                        document.getElementById('qeelonglet_'+name).className = 'qeelonglet_1 qeelonglet';
                        document.getElementById('contenu_qeelonglet_'+anc_qeelonglet).style.display = 'none';
                        document.getElementById('contenu_qeelonglet_'+name).style.display = 'block';
                        anc_qeelonglet = name;
                }
        //-->
    </script>
   
    <img src="http://image.noelshack.com/fichiers/2014/47/1416355133-asturiens.png" class="qeelonglet_1 qeelonglet" id="qeelonglet_Asturiens" onclick="javascript:change_qeelonglet('Asturiens');" />
    <img src="http://image.noelshack.com/fichiers/2014/47/1416355133-leronis.png" class="qeelonglet_0 qeelonglet" id="qeelonglet_Leronis" onclick="javascript:change_qeelonglet('Leronis');" />
    <img src="http://image.noelshack.com/fichiers/2014/47/1416355134-les-deserteurs.png" class="qeelonglet_0 qeelonglet" id="qeelonglet_Deserteurs" onclick="javascript:change_qeelonglet('Deserteurs');" />
    <img src="http://image.noelshack.com/fichiers/2014/47/1416355134-les-divins.png" class="qeelonglet_0 qeelonglet" id="qeelonglet_Divins" onclick="javascript:change_qeelonglet('Divins');" />
   
    <img src="http://image.noelshack.com/fichiers/2014/47/1416253868-ladycrowcoupe.png" class="contenu_qeelonglet" id="contenu_qeelonglet_Asturiens" />
    <img src="http://www.wired.com/images_blogs/rawfile/2013/11/offset_WaterHouseMarineImages_62652-2-660x440.jpg" class="contenu_qeelonglet" id="contenu_qeelonglet_Leronis" />
    <img src="http://www.gettyimages.co.uk/CMS/StaticContent/1391099215267_hero2.jpg" class="contenu_qeelonglet" id="contenu_qeelonglet_Deserteurs" />
    <img src="http://www.wired.com/images_blogs/rawfile/2013/11/offset_WaterHouseMarineImages_62652-2-660x440.jpg" class="contenu_qeelonglet" id="contenu_qeelonglet_Divins" />
   
    <script type="text/javascript">
        //<!--
                var anc_qeelonglet = 'Asturiens';
                change_qeelonglet(anc_qeelonglet);
        //-->
    </script>
   
  </div>
</div>
<!-- END disable_viewonline -->

Et pour ce qui est de le personnaliser...

Les images des descriptions sont les quatres dernières images à la fin, juste avant un javascript :

Code:

<img src="http://image.noelshack.com/fichiers/2014/47/1416253868-ladycrowcoupe.png" class="contenu_qeelonglet" id="contenu_qeelonglet_Asturiens" />
    <img src="http://www.wired.com/images_blogs/rawfile/2013/11/offset_WaterHouseMarineImages_62652-2-660x440.jpg" class="contenu_qeelonglet" id="contenu_qeelonglet_Leronis" />
    <img src="http://www.gettyimages.co.uk/CMS/StaticContent/1391099215267_hero2.jpg" class="contenu_qeelonglet" id="contenu_qeelonglet_Deserteurs" />
    <img src="http://www.wired.com/images_blogs/rawfile/2013/11/offset_WaterHouseMarineImages_62652-2-660x440.jpg" class="contenu_qeelonglet" id="contenu_qeelonglet_Divins" />

Ensuite, pour changer le texte des statistiques, je l'ai déjà changé afin que tu ais déjà la base de fait. Par exemple, disons que tu vois :

Code:

document.getElementById('totaluser').innerHTML=document.getElementById('totaluser').innerHTML.replace(/Nous avons/,"Nos<b><i>");

Cela veut dire que le "Nous avons" de la phrase "Nous avons X membres enregistrés" est remplacé par "Nos". À toi de changer tout cela par les phrases que tu veux tout en faisant attention de garder les balises "gras" et "italique" où elles le sont déjà \o/

Voili voilou ~

Grand merci à toi je vais voir ça!
Là en installant ça m'a mis les noms des groupes d'une manière un peu bizarre... est-ce le CSS ou j'ai mal collé? :O
Le tit lien: http://lazuli.forumactif.org/

EDIT: J'avais d'autres codes qui touchaient encore aux autres QEEL que j'avais bêtement essayé de faire! Encore merci à toi pour l'efficacité et la rapidité!

De rien, j'ai bien aimé le faire, ton schéma était super beau d'ailleurs ^^

N'oublies pas de mettre l'icône "terminé" pour que le sujet soit archivé