Code pour QEEL personnalisé

[MelissaD]

Rappel du premier message :

Bonjour,

Voilà je voudrais faire un QEEL personnalisé pour mon forum mais je ne sais pas comment faire... Pourriez-vous m'aider ?

J'ai déjà fait l'image, et une fois que vous la verrez vous comprendrez (enfin j'espère) :

Spoiler:

Merci d'avance

[MelissaD]

Merci comme ça c'est super, juste la ligne blanche en-dessous du texte comment on la retire ? Car elle gêne un peu... ^^'

[Lixyr]

Faites voir votre forum test, ainsi que votre code (partie QEEL template + css), maintenant. Je vais regarder ce qui cloche.

[MelissaD]

Maintenant c'est sur le forum normal plus sur le test ^^

Bref' le lien : http://blackriver-rpg.forumgratuit.org/
Et la ligne, enfin le rectangle, apparaît en-dessous des pseudos des membres connectés au cours des 24 dernières heures.

Voici le template :

Code:

    {JAVASCRIPT}
    <!-- BEGIN message_admin_index -->
    <table class="forumline" width="100%" border="0" cellspacing="1" cellpadding="0">
        <!-- BEGIN message_admin_titre -->
        <tr>
            <td class="catHead" height="28"><span class="cattitle">{message_admin_index.message_admin_titre.MES_TITRE}</span></td>
        </tr>
        <!-- END message_admin_titre -->
        <!-- BEGIN message_admin_txt -->
        <tr>
            <td class="row1" rowspan="3" align="center" valign="middle">
            <div class="gensmall">{message_admin_index.message_admin_txt.MES_TXT}</div>
            </td>
        </tr>
        <!-- END message_admin_txt -->
    </table>
    <!-- END message_admin_index -->

    <!-- BEGIN switch_user_login_form_header -->
    <form action="{S_LOGIN_ACTION}" method="post" name="form_login">
        <!-- BEGIN switch_fb_connect_no -->
        <table width="100%" border="0" cellspacing="0" cellpadding="0" class="user_login_form forumline">
            <tr>
                <td class="row1" align="center">
                    <table border="0" cellspacing="0" cellpadding="0">
                        <tr>
                            <td><span class="genmed">{L_USERNAME}:</span> </td>
                            <td><input class="post" type="text" size="10" name="username"/> </td>
                            <td>
                                <input class="radio" type="checkbox" name="autologin" {AUTOLOGIN_CHECKED} />
                                <span class="gensmall">{L_AUTO_LOGIN}</span>
                            </td>
                        </tr>

                        <tr>
                            <td><span class="genmed">{L_PASSWORD}:</span> </td>
                            <td><input class="post" type="password" size="10" name="password"/> </td>
                            <td>{S_HIDDEN_FIELDS}<input class="mainoption" type="submit" name="login" value="{L_LOGIN}" /></td>
                        </tr>
                    </table>
                </td>
            </tr>
        </table>
        <!-- END switch_fb_connect_no -->

        <!-- BEGIN switch_fb_connect -->
        <table width="100%" border="0" cellspacing="0" cellpadding="0" class="user_login_form forumline">
            <tr>
                <td valign="top" width="100%"  class="row1" align="center">
                    <table width="100%">
                        <tr>
                            <td width="55%" valign="middle" align="right">
                                <table class="right">
                                    <tr>
                                        <td><span class="genmed">{L_USERNAME}:</span> </td>
                                        <td><input class="post" type="text" size="10" name="username"/> </td>
                                        <td>
                                            <input class="radio" type="checkbox" name="autologin" {AUTOLOGIN_CHECKED} />
                                            <span class="gensmall">{L_AUTO_LOGIN}</span>
                                        </td>
                                    </tr>

                                    <tr>
                                        <td><span class="genmed">{L_PASSWORD}:</span> </td>
                                        <td><input class="post" type="password" size="10" name="password"/> </td>
                                        <td>{S_HIDDEN_FIELDS}<input class="mainoption" type="submit" name="login" value="{L_LOGIN}" /></td>
                                    </tr>
                                </table>
                            </td>
                            <td width="10%" align="center" valign="middle">
                                <span class="genmed fb_or">{switch_user_login_form_header.switch_fb_connect.L_OR}</span>
                            </td>
                            <td width="35%" class="align_gauche"><fb:login-button size="large" onlogin="window.location='/facebook_connect.forum'" v="2" perms="{switch_user_login_form_header.switch_fb_connect.L_FB_PERMISSIONS}">{switch_user_login_form_header.switch_fb_connect.L_FB_LOGIN_BUTTON}</fb:login-button></td>
                        </tr>
                    </table>
                </td>
            </tr>
        </table>
        <!-- END switch_fb_connect -->
    </form>
    <!-- END switch_user_login_form_header -->

    {CHATBOX_TOP}
    {BOARD_INDEX}
    <table width="100%" border="0" cellspacing="0" cellpadding="0">
        <tr>
            <td width="50%" valign="top">
                <!-- BEGIN switch_user_logged_in -->
                <span class="gensmall"><a href="{U_MARK_READ}" class="gensmall">{L_MARK_FORUMS_READ}</a>
                <!-- END switch_user_logged_in -->
                <!-- BEGIN switch_delete_cookies -->
                <br /><a href="{switch_delete_cookies.U_DELETE_COOKIES}" class="gensmall">{switch_delete_cookies.L_DELETE_COOKIES}</a>
                <!-- END switch_delete_cookies -->
                </span>
            </td>
            <td width="50%" align="right">
                <span class="gensmall">
                    <a href="{U_TODAY_ACTIVE}" class="gensmall">{L_TODAY_ACTIVE}</a><br />
                    <a href="{U_TODAY_POSTERS}" class="gensmall">{L_TODAY_POSTERS}</a><br />
                    <a href="{U_OVERALL_POSTERS}" class="gensmall">{L_OVERALL_POSTERS}</a>
                    <!-- BEGIN switch_on_index -->
                        <!-- BEGIN switch_delete_cookies -->
                        <br /><a href="{switch_on_index.switch_delete_cookies.U_DELETE_COOKIES}" class="gensmall">{switch_on_index.switch_delete_cookies.L_DELETE_COOKIES}</a>
                        <!-- END switch_delete_cookies -->
                    <!-- END switch_on_index -->
                </span>
            </td>
        </tr>
    </table>

    <!-- BEGIN switch_user_login_form_footer -->
    <form action="{S_LOGIN_ACTION}" method="post" name="form_login">
        <!-- BEGIN switch_fb_connect_no -->
        <table width="100%" border="0" cellspacing="0" cellpadding="0" class="user_login_form forumline">
            <tr>
                <td class="row1" align="center">
                    <table border="0" cellspacing="0" cellpadding="0">
                        <tr>
                            <td><span class="genmed">{L_USERNAME}:</span> </td>
                            <td><input class="post" type="text" size="10" name="username"/> </td>
                            <td>
                                <input class="radio" type="checkbox" name="autologin" {AUTOLOGIN_CHECKED} />
                                <span class="gensmall">{L_AUTO_LOGIN}</span>
                            </td>
                        </tr>

                        <tr>
                            <td><span class="genmed">{L_PASSWORD}:</span> </td>
                            <td><input class="post" type="password" size="10" name="password"/> </td>
                            <td>{S_HIDDEN_FIELDS}<input class="mainoption" type="submit" name="login" value="{L_LOGIN}" /></td>
                        </tr>
                    </table>
                </td>
            </tr>
        </table>
        <!-- END switch_fb_connect_no -->

        <!-- BEGIN switch_fb_connect -->
        <table width="100%" border="0" cellspacing="0" cellpadding="0" class="user_login_form forumline">
            <tr>
                <td valign="top" width="100%"  class="row1" align="center">
                    <table width="100%">
                        <tr>
                            <td width="55%" valign="middle">
                                <table class="right">
                                    <tr>
                                        <td><span class="genmed">{L_USERNAME}:</span> </td>
                                        <td><input class="post" type="text" size="10" name="username"/> </td>
                                        <td>
                                            <input class="radio" type="checkbox" name="autologin" {AUTOLOGIN_CHECKED} />
                                            <span class="gensmall">{L_AUTO_LOGIN}</span>
                                        </td>
                                    </tr>

                                    <tr>
                                        <td><span class="genmed">{L_PASSWORD}:</span> </td>
                                        <td><input class="post" type="password" size="10" name="password"/> </td>
                                        <td>{S_HIDDEN_FIELDS}<input class="mainoption" type="submit" name="login" value="{L_LOGIN}" /></td>
                                    </tr>
                                </table>
                            </td>
                            <td width="10%" align="center" valign="middle">
                                <span class="genmed fb_or">{switch_user_login_form_footer.switch_fb_connect.L_OR}</span>
                            </td>
                            <td width="35%" class="align_gauche"><fb:login-button size="large" onlogin="window.location='/facebook_connect.forum'" v="2" perms="{switch_user_login_form_footer.switch_fb_connect.L_FB_PERMISSIONS}">{switch_user_login_form_footer.switch_fb_connect.L_FB_LOGIN_BUTTON}</fb:login-button></td>
                        </tr>
                    </table>
                </td>
            </tr>
        </table>
        <!-- END switch_fb_connect -->
    </form>
    <!-- END switch_user_login_form_footer -->

    <!-- BEGIN disable_viewonline -->
    <table class="QEEL" width="100%" border="0" cellspacing="16" cellpadding="0">
        <tr>
          <td width="100%">
                <table border="0" width="100%">
                      <tr>
          <td width="62%"></td>
          <td width="38%" height="200" align="right" valign="top" style="font-size:11px;">

<table cellspacing="16" valign="top" style="text-align:right; padding-top:8px;" border="0" width="100%">
<tr><td align="center"><a href="http://blackriver-rpg.forumgratuit.org/g2-chasseurs"><font color="#000000">Chasseurs</font></a></td>
<td align="left"><a href="http://blackriver-rpg.forumgratuit.org/g3-loups-garou"><font color="#000000">Loups-garous</font></a> </td>
</tr>
<tr><td align="center"><a href="http://blackriver-rpg.forumgratuit.org/g4-vampires"><font color="#000000">Vampires</font></a></td>
<td align="left"><a href="http://blackriver-rpg.forumgratuit.org/g5-sorcieres"><font color="#000000">Sorcièr(e)s</font></a></td>
</tr>
<tr><td align="center"><a href="http://blackriver-rpg.forumgratuit.org/g6-journalistes"><font color="#000000">Journalistes</font></a></td>
<td align="left"><a href="http://blackriver-rpg.forumgratuit.org/g7-sherif-co"><font color="#000000">Shérif & co.</font></a></td>
</tr>
<tr><td align="center"><a href="http://blackriver-rpg.forumgratuit.org/g8-autres-creatures"><font color="#000000">Autres</font></td>
<td align="left"><span style="font-size:9px;"><a href="http://blackriver-rpg.forumgratuit.org/g9-civils-de-blackriver"><font color="#000000">Civils</font></a></span></td>
</tr>
<tr><td colspan="2" align="center"><a href="http://blackriver-rpg.forumgratuit.org/g10-mediums"><font color="#000000">Médiums</font></a></td>
</tr></table></td></tr></table>

</td>
</tr>
<tr>

            <td width="100%">

<table border="0" cellpadding="5" width="55%" height:"197" style="text-align:center; margin-left:22%; padding-top:8px;"><tr><td>

<span class="gensmall">{TOTAL_POSTS}<br />
            {TOTAL_USERS}<br />
            {NEWEST_USER}</span><br>
<span class="gensmall">{TOTAL_USERS_ONLINE}<br />
            {RECORD_USERS}<br />
            <br />
            {LOGGED_IN_USER_LIST}</span>
</td>
        </tr>
</table>
</td>
</tr>
<tr><td>


<table style="margin-left: 7%; padding-top:8px;" width:"100%"><tr><td>
<table border="0" id="connected" cellspacing="10" width="645" height="60" valign="top">{L_CONNECTED_MEMBERS}
    <script type="text/javascript">document.getElementById('connected').innerHTML=document.getElementById ('connected').innerHTML.replace(/Membres connectés au cours des 24 dernières heures :/,"");</script>
</table>
</td></tr></table>

   
       
                 
    </table>
    <!-- END disable_viewonline -->
    {CHATBOX_BOTTOM}
    <br clear="all" />
    <!-- BEGIN switch_legend -->
    <table border="0" cellspacing="3" cellpadding="0" align="center">
        <tr>
            <td align="center" width="20"><img src="{FORUM_NEW_IMG}" alt="{L_NEW_POSTS}" /></td>
            <td><span class="gensmall">{L_NEW_POSTS}</span></td>
            <td></td>
            <td align="center" width="20"><img src="{FORUM_IMG}" alt="{L_NO_NEW_POSTS}" /></td>
            <td><span class="gensmall">{L_NO_NEW_POSTS}</span></td>
            <td>  </td>
            <td align="center" width="20"><img src="{FORUM_LOCKED_IMG}" alt="{L_FORUM_LOCKED}" /></td>
            <td><span class="gensmall">{L_FORUM_LOCKED}</span></td>
        </tr>
    </table>
    <!-- END switch_legend -->

    {AUTO_DST}

    <!-- BEGIN switch_fb_index_login -->
    <div id="fb-root"></div>
    <script type="text/javascript">
    //<![CDATA[
    FB.init({
        appId: '{switch_fb_index_login.FACEBOOK_APP_ID}',
          status: true,
          cookie: true,
          xfbml: true
    });
    //]]>
    </script>
    <!-- END switch_fb_index_login -->
    <html><head>
    <style type="text/css">
    .mycss
    {
    font-weight:normal;font-variant:small-caps;color:#000000;letter-spacing:1pt;word-spacing:2pt;font-size:11px;text-align:center;font-family:arial, helvetica, sans-serif;line-height:1;
    }
    </style>
    </head>
    <body>
    <p class="mycss">© BlackRiver RPG.</p>

Et le CSS :

Code:

    /******************* NAVIGATION******************************/

    a.mainmenu{
    margin-left : 4px;
    margin-right : 4px;
    font-family : Trebuchet MS;
    color: #000000;
    background-color: #DFCAE3;
    text-align:none;
    border-left: 4px solid #A061AD;
    border-right: 4px solid none;
    }


    /******************* FIN******************************/








    /******************* PA******************************/
    .titre {
    text-align: center;
    font-size: 16px;
    font-style: oblique;
    margin-top: 1%;
    background: #DFCAE3;
    -moz-border-radius: 20px;
    display: block;}

    .fond {
    background-color: #C7A2CF;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    vertical-align: top;
    }

    .lienpa {
    border-left: 10px solid #C7A2CF;
    border-right: 10px solid #C7A2CF;
    -moz-border-radius-topleft: 10px;
    -webkit-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    -webkit-border-radius-topright: 10px;
    background-color: #C7A2CF;
    text-align: center;
    }

    .imginfo {  /* INFOBULLES */
      position: relative;
      color: #7d7d7d; /* couleur de votre texte */
      text-decoration: none;
      border-bottom: 0px #7d7d7d solid; /* on souligne le texte */
    }

    .imginfo span {
      display: none; /* on masque l'infobulle */
    }
    .imginfo:hover {
      background: none; /* correction d'un bug IE */
      z-index: 999; /* on définit une valeur pour l'ordre d'affichage */
      cursor: help; /* on change le curseur par défaut en curseur d'aide */
    }
    .imginfo:hover span {
      display: inline; /* on affiche l'infobulle */
      position: absolute;
      white-space: nowrap; /* on change la valeur de la propriété white-space pour qu'il n'y ait pas de retour à la ligne non-désiré */
      top: 10px; /* on positionne notre infobulle */
      left: 20px;
      background: #DFCAE3;
      color: #7d7d7d;
      padding: 3px;
      border: 0px solid #FFFFFF;
      border-left: 5px solid #FFFFFF; /* vos couleurs et taille de bordures */
      border-right: 3px solid #FFFFFF;
      border-top: 3px solid #FFFFFF;
      border-bottom: 5px solid #FFFFFF;
    }


    /******************* FIN******************************/




    /******************* ARRONDISSEMENT DES BOUTONS DU FORUM******************************/

    .button2{ -moz-border-radius: 5px;}

    /******************* FIN******************************/




    /******************* ARRONDISSEMENT DU CADRE DU FORUM******************************/

    .bodyline{ -moz-border-radius: 20px;}

    /******************* FIN******************************/



    /******************* FOND EN NO REPETITION******************************/

    body{
    background-image: url('http://nsa27.casimages.com/img/2011/07/12/110712054050465706.png');
    background-repeat: no-repeat;}

    /******************* FIN******************************/




    /******************* LIENS GRANDISSANT AU SURVOL DE LA SOURIS******************************/

    a:hover {
    text-decoration: none !important;
    text-transform: uppercase;
    border-bottom : 1px dotted #000000
    font-variant: small-caps;
    letter-spacing : 1px;
    }

    /******************* FIN******************************/




    /******************* ENLEVER SOULIGNEMENT DES LIENS******************************/

    a:hover{text-decoration: none !important;}
    a{text-decoration: none !important;}

    /******************* FIN******************************/






    /******************* QEEL ******************************/

    .QEEL {background-image:url(http://nsa27.casimages.com/img/2011/07/12/110712073328977636.png);
background-repeat:no-repeat;
background-position:top center;
width:829px;
height:443px;}

#connected {background:none !important;text-align:center;vertical-align:top;  overflow-y : auto; }

    /******************* FIN******************************/

[Lixyr]

Ah oui le fameux fond. ^^

Rajoutez ceci dans le css, et tout ira mieux :

Code:

    #connected .row1 {background:none !important;}

Par contre, j'ai remarqué que quand on passe la souris sur les groupes, ils grossissent et sortent du cadre. Je conseille donc, mais ce n'est qu'un avis, que vous mettiez une classe pour chaque lien afin que le grossissement ne prenne pas sur les liens des groupes. Ça ferait mieux et ça ne marcherait que sur les liens des groupes, c'est à dire que sur les autres liens du forums, ils resteraient comme actuellement : en majuscule au passage de la souris.

[MelissaD]

Ah merci c'est super comme ça =D

Merci encore

Sujet résolu :}

[Lixyr]

Je vous en prie. ^^