Who's Online Tabs

Does anyone know how to create this wonderful looking online tab thingy.



My forum is www.worldofmutants.forumotion.com

I use Phbb2

Thank you!

Just follow this tutorial:
http://www.csshelp.net/t119-turn-statistics-into-tabs-phpbb2-and-punbb-only

I am searching for the "stats" line in my code and I can't find it. Do you know where it is?

Hello Asriel,
If you want, you can post your index_body template entirely in a code here and I can add the proper codes for you

Sincerely,
BD

Ok...cool!   

Thanks!

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">
                                                  <div><link href='http://fonts.googleapis.com/css?family=Seaweed+Script' rel='stylesheet' type='text/css'><div style="font-family: seaweed script; text-align: none;">{L_USERNAME}</div></span> </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" scope="{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></span>
            <!-- END switch_user_logged_in -->
            <!-- BEGIN switch_delete_cookies -->
            <br /><span class="gensmall"><a href="{switch_delete_cookies.U_DELETE_COOKIES}" class="gensmall">{switch_delete_cookies.L_DELETE_COOKIES}</a></span>
            <!-- END switch_delete_cookies -->
        </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"><link href='http://fonts.googleapis.com/css?family=Economica' rel='stylesheet' type='text/css'><div style="font-family: economica;">{L_USERNAME}</div>:</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" scope="{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="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"><div><link href='http://fonts.googleapis.com/css?family=Montserrat+Alternates' rel='stylesheet' type='text/css'><div style="font-family: montserrat alternates; text-align: none;">{LEGEND} : {GROUP_LEGEND}</div></span></td>
    </tr>
    <!-- BEGIN switch_chatbox_activate -->
    <tr>
        <td class="row1">
                  <span class="gensmall"><div><link href='http://fonts.googleapis.com/css?family=Montserrat+Alternates' rel='stylesheet' type='text/css'><div style="font-family: montserrat alternates; text-align: none;">{TOTAL_CHATTERS_ONLINE}</div> :  {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}', '<div><link href='http://fonts.googleapis.com/css?family=Montserrat+Alternates' rel='stylesheet' type='text/css'><div style="font-family: montserrat alternates; text-align: none;">{L_CLICK_TO_JOIN_CHAT}');</div>
                //]]>
                </script>
                <!-- END switch_chatbox_popup -->
            </span>
        </td>
    </tr>
    <!-- END switch_chatbox_activate -->
</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,
    oauth: true
});
//]]>
          </script><br />
<!-- END switch_fb_index_login -->
         
<!--AFFILIATES OF OUR SITE! DO NOT ALTER OR DELETE-->
         
   
    <table>
    <tr>
    <th>Affiliates</th>
    </tr>
    <tr>
      <td>
         
<a href="http://www.rpg-directory.com/" target="_blank"><img src="http://rpg-directory.com/images/affiliate.png"/></a>
<a href="http://onemassivelyfungame.com" target="_blank"><img src="http://onemassivelyfungame.com/omfgmini1.jpg"/></a>
<a href="http://superhero-rpg.forum-motion.com/" target="_blank"><img src="http://i11.servimg.com/u/f11/17/76/90/33/affili11.gif"/></a>    
<a href="http://z9.invisionfree.com/nexus_rpg" target="_blank"><img src="http://i305.photobucket.com/albums/nn226/nexus616/button.jpg"/></a>    
<a href="http://z4.invisionfree.com/Xrevolution" Target="_blank"><img src="http://i9.photobucket.com/albums/a75/amayademorte/xmen/X-Button.jpg"/></a>   
<a href="http://totaldramawebsite.net" target="_blank"><img src="http://totaldramawebsite.net/wordpress/wp-content/uploads/2011/12/aniexchbutton2.gif"/></a>     
<a href="http://a1000years.forumotion.com" target="_blank"><img src="http://i81.servimg.com/u/f81/18/27/77/43/aty20115.png"/></a>     
<a href="http://sw-lostrepublic.forumotion.com/" target="_blank"><img src="http://i12.servimg.com/u/f12/17/99/30/90/sw_aff10.png" height="31" width="88"/></a>     
<a href="http://z13.invisionfree.com/thewalkingdead2/index.php" target="_blank"><img src="http://i947.photobucket.com/albums/ad312/bloodonthe/walkingdeadbann-3.png"/></a> 
<a href="http://a-new-age.forumotion.com" target="_blank"><img src="http://i17.servimg.com/u/f17/17/48/02/71/a_new_10.png"/></a>     
<a href="http://z13.invisionfree.com/embracing_destiny"target="_blank"><img src="http://i1114.photobucket.com/albums/k525/tyranny19/Embracing%20Destiny/EDbutton_zpsb2e9d526.jpg"/></a>     
<a href="http://weekenders.b1.jcink.com" target="_blank"><img src='http://i95.photobucket.com/albums/l156/pinkrevolvers/weekenders/wwbutton7.gif' alt='Weekend Warriors' /></a>
<a href="http://athrivingworld.proboards.com" target="_blank"><img src="http://i1124.photobucket.com/albums/l574/athrivingworld/thrivingworld1-2.png"/></a>     
<a href="http://beautifultragedy.b1.jcink.com" target="_blank"><img src="http://i.imgur.com/KLA7SB1.png"/></a>
      </td>
      </tr>
    </table>
             
<!--AFFILIATES END-->
     
      <!--CHATBOX POP-UP BEGINS-->
          <div id="chatbox_ret_cont" onmouseout="stopINT()" onclick="stopINT()" onmousever="stopINT()" style="border-top: 7px solid rgb(000, 00, 00); border-left: 7px solid rgb(000, 00, 00); z-index: 10000; -moz-border-radius: 20px 0pt 0pt 0pt; background-color: #FB000D; position: fixed; bottom: 0pt; right: 0pt; border-color: #FB000D;"><div onclick="(document.getElementById('chatbox_ret').style.display=='block')?my_setcookie('chatbox_ret','0',0,0):my_setcookie('chatbox_ret','1',1,0); $('#chatbox_ret').toggle('normal');" style="font-size: 12px; font-family: 'trebuchet ms',serif; cursor: pointer; padding: 3px;"><span id="chatbox_ret_online" style="color: white);"><span style="font-weight: bold; color: White;">WOM Chat</span><br></span><span id="chatbox_ret_offline" style="color: white;"></span></div><iframe onload="if(cb_new) { cb_start(); cb_new=0; }" style="width: 740px; height: 400px; display: none;" marginheight="0" marginwidth="0" name="chatbox_ret" id="chatbox_ret" src="http://worldofmutants.forumotion.com/chatbox/chatbox.forum" frameborder="0" scrolling="no"></iframe></div>


Here, try changing your entire index_body to the following code.

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">
                                                  <div><link href='http://fonts.googleapis.com/css?family=Seaweed+Script' rel='stylesheet' type='text/css'><div style="font-family: seaweed script; text-align: none;">{L_USERNAME}</div></span> </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" scope="{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></span>
            <!-- END switch_user_logged_in -->
            <!-- BEGIN switch_delete_cookies -->
            <br /><span class="gensmall"><a href="{switch_delete_cookies.U_DELETE_COOKIES}" class="gensmall">{switch_delete_cookies.L_DELETE_COOKIES}</a></span>
            <!-- END switch_delete_cookies -->
        </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"><link href='http://fonts.googleapis.com/css?family=Economica' rel='stylesheet' type='text/css'><div style="font-family: economica;">{L_USERNAME}</div>:</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" scope="{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 -->

<div id="stats">
        <div id="tabs_container">
    <ul id="stabs">
        <li class="active"><a href="#tab1">Statistics</a></li>
      <li><a href="#tab2">Who is online</a></li>
        <li><a href="#tab3">Birthdays</a></li>
        <li><a href="#tab4">About us</a></li>
        <li><a href="#tab5">Copyright</a></li>
    </ul>
</div>

<div id="tabs_content_container">
    <div id="tab1" class="tab_content" style="display: block;">
        <p><p><p>{TOTAL_POSTS}</p>
<p>{TOTAL_USERS}</p>
<p>{NEWEST_USER}</p></p></p>
    </div>
    <div id="tab2" class="tab_content">
        <p>
<img src="{L_ONLINE_IMG}" alt="{L_WHO_IS_ONLINE}" />
<p>
<!-- BEGIN switch_viewonline_link -->
<a href="{U_VIEWONLINE}" rel="nofollow"></a>
<!-- END switch_viewonline_link -->
<!-- BEGIN switch_viewonline_nolink -->
{L_WHO_IS_ONLINE}
<!-- END switch_viewonline_nolink --></p>
<p>{TOTAL_USERS_ONLINE}<br />
{RECORD_USERS}
<br />
{LOGGED_IN_USER_LIST}
{L_ONLINE_USERS}
{L_CONNECTED_MEMBERS}<br />
<div class="clear"></div>
<p>{LEGEND} : {GROUP_LEGEND}</p></div></p>
    <div id="tab3" class="tab_content">
        <p><p>{L_WHOSBIRTHDAY_TODAY}</p>
        <p>{L_WHOSBIRTHDAY_WEEK}</p></p>
    </div>
    <div id="tab4" class="tab_content">
        <p>Content for About Us goes here.</p>
    </div>
    <div id="tab5" class="tab_content">
        <p>Content for Copyright goes here.</p>
    </div>
</div>

    <!-- BEGIN switch_chatbox_activate -->
    <tr>
        <td class="row1">
                  <span class="gensmall"><div><link href='http://fonts.googleapis.com/css?family=Montserrat+Alternates' rel='stylesheet' type='text/css'><div style="font-family: montserrat alternates; text-align: none;">{TOTAL_CHATTERS_ONLINE}</div> :  {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}', '<div><link href='http://fonts.googleapis.com/css?family=Montserrat+Alternates' rel='stylesheet' type='text/css'><div style="font-family: montserrat alternates; text-align: none;">{L_CLICK_TO_JOIN_CHAT}');</div>
                //]]>
                </script>
                <!-- END switch_chatbox_popup -->
            </span>
        </td>
    </tr>
    <!-- END switch_chatbox_activate -->
</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,
    oauth: true
});
//]]>
          </script><br />
<!-- END switch_fb_index_login -->
          
<!--AFFILIATES OF OUR SITE! DO NOT ALTER OR DELETE-->
          
    
    <table>
    <tr>
    <th>Affiliates</th>
    </tr>
    <tr>
      <td>
          
<a href="http://www.rpg-directory.com/" target="_blank"><img src="http://rpg-directory.com/images/affiliate.png"/></a>
<a href="http://onemassivelyfungame.com" target="_blank"><img src="http://onemassivelyfungame.com/omfgmini1.jpg"/></a>
<a href="http://superhero-rpg.forum-motion.com/" target="_blank"><img src="http://i11.servimg.com/u/f11/17/76/90/33/affili11.gif"/></a>     
<a href="http://z9.invisionfree.com/nexus_rpg" target="_blank"><img src="http://i305.photobucket.com/albums/nn226/nexus616/button.jpg"/></a>     
<a href="http://z4.invisionfree.com/Xrevolution" Target="_blank"><img src="http://i9.photobucket.com/albums/a75/amayademorte/xmen/X-Button.jpg"/></a>    
<a href="http://totaldramawebsite.net" target="_blank"><img src="http://totaldramawebsite.net/wordpress/wp-content/uploads/2011/12/aniexchbutton2.gif"/></a>      
<a href="http://a1000years.forumotion.com" target="_blank"><img src="http://i81.servimg.com/u/f81/18/27/77/43/aty20115.png"/></a>      
<a href="http://sw-lostrepublic.forumotion.com/" target="_blank"><img src="http://i12.servimg.com/u/f12/17/99/30/90/sw_aff10.png" height="31" width="88"/></a>      
<a href="http://z13.invisionfree.com/thewalkingdead2/index.php" target="_blank"><img src="http://i947.photobucket.com/albums/ad312/bloodonthe/walkingdeadbann-3.png"/></a>  
<a href="http://a-new-age.forumotion.com" target="_blank"><img src="http://i17.servimg.com/u/f17/17/48/02/71/a_new_10.png"/></a>      
<a href="http://z13.invisionfree.com/embracing_destiny"target="_blank"><img src="http://i1114.photobucket.com/albums/k525/tyranny19/Embracing%20Destiny/EDbutton_zpsb2e9d526.jpg"/></a>      
<a href="http://weekenders.b1.jcink.com" target="_blank"><img src='http://i95.photobucket.com/albums/l156/pinkrevolvers/weekenders/wwbutton7.gif' alt='Weekend Warriors' /></a>
<a href="http://athrivingworld.proboards.com" target="_blank"><img src="http://i1124.photobucket.com/albums/l574/athrivingworld/thrivingworld1-2.png"/></a>      
<a href="http://beautifultragedy.b1.jcink.com" target="_blank"><img src="http://i.imgur.com/KLA7SB1.png"/></a>
      </td>
      </tr>
    </table>
              
<!--AFFILIATES END-->
      
      <!--CHATBOX POP-UP BEGINS-->
          <div id="chatbox_ret_cont" onmouseout="stopINT()" onclick="stopINT()" onmousever="stopINT()" style="border-top: 7px solid rgb(000, 00, 00); border-left: 7px solid rgb(000, 00, 00); z-index: 10000; -moz-border-radius: 20px 0pt 0pt 0pt; background-color: #FB000D; position: fixed; bottom: 0pt; right: 0pt; border-color: #FB000D;"><div onclick="(document.getElementById('chatbox_ret').style.display=='block')?my_setcookie('chatbox_ret','0',0,0):my_setcookie('chatbox_ret','1',1,0); $('#chatbox_ret').toggle('normal');" style="font-size: 12px; font-family: 'trebuchet ms',serif; cursor: pointer; padding: 3px;"><span id="chatbox_ret_online" style="color: white);"><span style="font-weight: bold; color: White;">WOM Chat</span><br></span><span id="chatbox_ret_offline" style="color: white;"></span></div><iframe onload="if(cb_new) { cb_start(); cb_new=0; }" style="width: 740px; height: 400px; display: none;" marginheight="0" marginwidth="0" name="chatbox_ret" id="chatbox_ret" src="http://worldofmutants.forumotion.com/chatbox/chatbox.forum" frameborder="0" scrolling="no"></iframe></div>

Then add the following code to your CSS:

Code:

#tabs_container {
    border-bottom: 1px solid #ccc;
}
#stabs {
    list-style: none;
    padding: 5px 0 4px 0;
    margin: 0 0 0 10px;
    font-family: Verdana,Arial,Helvetica,sans-serif;
    font-size: 13px;
}
#stabs li {
    display: inline;
}
#stabs li a {
    border: 1px solid #ccc;
    padding: 4px 6px;
    text-decoration: none;
    background-color: #eeeeee;
    border-bottom: none;
    outline: none;
    border-radius: 5px 5px 0 0;
    -moz-border-radius: 5px 5px 0 0;
    -webkit-border-top-left-radius: 5px;
    -webkit-border-top-right-radius: 5px;
}
#stabs li a:hover {
    background-color: #dddddd;
    padding: 4px 6px;
}
#stabs li.active a {
    border-bottom: 1px solid #fff;
    background-color: #fff;
    padding: 4px 6px 5px 6px;
    border-bottom: none;
}
#stabs li.active a:hover {
    background-color: #eeeeee;
    padding: 4px 6px 5px 6px;
    border-bottom: none;
}
 
#tabs_content_container {
    border: 1px solid #ccc;
    border-top: none;
    padding: 10px;
}
.tab_content {
    display: none;
}

Finally, add the following code to your Javascript: (Mark in All Pages!)

Code:

$(document).ready(function(){
    //  When user clicks on tab, this code will be executed
    $("#stabs li").click(function() {
        //  First remove class "active" from currently active tab
        $("#stabs li").removeClass('active');
 
        //  Now add class "active" to the selected/clicked tab
        $(this).addClass("active");
 
        //  Hide all tab content
        $(".tab_content").hide();
 
        //  Here we get the href value of the selected tab
        var selected_tab = $(this).find("a").attr("href");
 
        //  Show the selected tab content
        $(selected_tab).fadeIn();
 
        //  At the end, we add return false so that the click on the link is not executed
        return false;
    });
});

Then, this should work! If it doesn't work then please let me know!

The tabs do not switch as they should. Did I do something wrong?

And the old stats are way at the top where they shouldn't be.

Have you added the javascript to all pages?

You need to go to ACP --> Modules --> Javascript Management --> Create Javascript --> Name it --> Mark "All Pages" --> Put code in --> Save.

I did do that.

Not in all pages! You have to put it in the homepage only


Please wait 10-15 minutes to make you the code!

Ok sure. Thanks.

Please delete all the index_body template and replace it with this

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">
                                                <div><link href='http://fonts.googleapis.com/css?family=Seaweed+Script' rel='stylesheet' type='text/css'><div style="font-family: seaweed script; text-align: none;">{L_USERNAME}</div></span> </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" scope="{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></span>
          <!-- END switch_user_logged_in -->
          <!-- BEGIN switch_delete_cookies -->
          <br /><span class="gensmall"><a href="{switch_delete_cookies.U_DELETE_COOKIES}" class="gensmall">{switch_delete_cookies.L_DELETE_COOKIES}</a></span>
          <!-- END switch_delete_cookies -->
      </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"><link href='http://fonts.googleapis.com/css?family=Economica' rel='stylesheet' type='text/css'><div style="font-family: economica;">{L_USERNAME}</div>:</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" scope="{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 -->[/color]


<!-- BEGIN disable_viewonline -->[/color]


<div id="tabs_container">
<ul id="stabs">
<li class="active"><a href="#tab1">Statistics</a></li>
      <li><a href="#tab2">Who is Online</a></li>
    <li><a href="#tab3">Birthdays</a></li>
<li><a href="#tab4">About us</a></li>

<li><a href="#tab5">Copyright</a></li>

<li><a href="#tab6">Member Groups</a></li>

</ul>
</div>
<div id="tabs_content_container">
    <div id="tab1" class="tab_content" style="display: block;">
        <p><span class="gensmall">{TOTAL_POSTS}<br />
      {TOTAL_USERS}<br />
      {NEWEST_USER}</span></p>
    </div>
    <div id="tab2" class="tab_content">
        <p><span class="gensmall">{TOTAL_USERS_ONLINE}<br />
      {RECORD_USERS}<br />
      <br />
      {LOGGED_IN_USER_LIST}</span>
  </tr>
        {L_CONNECTED_MEMBERS}</p>
    </div>
    <div id="tab3" class="tab_content">
        <p> {L_WHOSBIRTHDAY_TODAY}
  {L_WHOSBIRTHDAY_WEEK}</p>
    </div>
<div id="tab4" class="tab_content">
        <p>The about us informations go here.</p>
    </div>
<div id="tab5" class="tab_content">
        <p>The Copyrights of the forum goes here.</p>
    </div>
<div id="tab6" class="tab_content">
        <p><span class="gensmall"><div><link href='http://fonts.googleapis.com/css?family=Montserrat+Alternates' rel='stylesheet' type='text/css'><div style="font-family: montserrat alternates; text-align: none;">{LEGEND} : {GROUP_LEGEND}</div></span></p>
    </div>
</div>


  <!-- BEGIN switch_chatbox_activate -->
  <tr>
      <td class="row1">
                <span class="gensmall"><div><link href='http://fonts.googleapis.com/css?family=Montserrat+Alternates' rel='stylesheet' type='text/css'><div style="font-family: montserrat alternates; text-align: none;">{TOTAL_CHATTERS_ONLINE}</div> :  {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}', '<div><link href='http://fonts.googleapis.com/css?family=Montserrat+Alternates' rel='stylesheet' type='text/css'><div style="font-family: montserrat alternates; text-align: none;">{L_CLICK_TO_JOIN_CHAT}');</div>
              //]]>
              </script>
              <!-- END switch_chatbox_popup -->
          </span>
      </td>
  </tr>
  <!-- END switch_chatbox_activate -->
</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,
  oauth: true
});
//]]>
        </script><br />
<!-- END switch_fb_index_login -->
       
<!--AFFILIATES OF OUR SITE! DO NOT ALTER OR DELETE-->
       
 
  <table>
  <tr>
  <th>Affiliates</th>
  </tr>
  <tr>
    <td>
       
<a href="http://www.rpg-directory.com/" target="_blank"><img src="http://rpg-directory.com/images/affiliate.png"/></a>
<a href="http://onemassivelyfungame.com" target="_blank"><img src="http://onemassivelyfungame.com/omfgmini1.jpg"/></a>
<a href="http://superhero-rpg.forum-motion.com/" target="_blank"><img src="http://i11.servimg.com/u/f11/17/76/90/33/affili11.gif"/></a>   
<a href="http://z9.invisionfree.com/nexus_rpg" target="_blank"><img src="http://i305.photobucket.com/albums/nn226/nexus616/button.jpg"/></a>   
<a href="http://z4.invisionfree.com/Xrevolution" Target="_blank"><img src="http://i9.photobucket.com/albums/a75/amayademorte/xmen/X-Button.jpg"/></a>   
<a href="http://totaldramawebsite.net" target="_blank"><img src="http://totaldramawebsite.net/wordpress/wp-content/uploads/2011/12/aniexchbutton2.gif"/></a>     
<a href="http://a1000years.forumotion.com" target="_blank"><img src="http://i81.servimg.com/u/f81/18/27/77/43/aty20115.png"/></a>     
<a href="http://sw-lostrepublic.forumotion.com/" target="_blank"><img src="http://i12.servimg.com/u/f12/17/99/30/90/sw_aff10.png" height="31" width="88"/></a>     
<a href="http://z13.invisionfree.com/thewalkingdead2/index.php" target="_blank"><img src="http://i947.photobucket.com/albums/ad312/bloodonthe/walkingdeadbann-3.png"/></a> 
<a href="http://a-new-age.forumotion.com" target="_blank"><img src="http://i17.servimg.com/u/f17/17/48/02/71/a_new_10.png"/></a>     
<a href="http://z13.invisionfree.com/embracing_destiny"target="_blank"><img src="http://i1114.photobucket.com/albums/k525/tyranny19/Embracing%20Destiny/EDbutton_zpsb2e9d526.jpg"/></a>     
<a href="http://weekenders.b1.jcink.com" target="_blank"><img src='http://i95.photobucket.com/albums/l156/pinkrevolvers/weekenders/wwbutton7.gif' alt='Weekend Warriors' /></a>
<a href="http://athrivingworld.proboards.com" target="_blank"><img src="http://i1124.photobucket.com/albums/l574/athrivingworld/thrivingworld1-2.png"/></a>     
<a href="http://beautifultragedy.b1.jcink.com" target="_blank"><img src="http://i.imgur.com/KLA7SB1.png"/></a>
    </td>
    </tr>
  </table>
           
<!--AFFILIATES END-->
   
    <!--CHATBOX POP-UP BEGINS-->
        <div id="chatbox_ret_cont" onmouseout="stopINT()" onclick="stopINT()" onmousever="stopINT()" style="border-top: 7px solid rgb(000, 00, 00); border-left: 7px solid rgb(000, 00, 00); z-index: 10000; -moz-border-radius: 20px 0pt 0pt 0pt; background-color: #FB000D; position: fixed; bottom: 0pt; right: 0pt; border-color: #FB000D;"><div onclick="(document.getElementById('chatbox_ret').style.display=='block')?my_setcookie('chatbox_ret','0',0,0):my_setcookie('chatbox_ret','1',1,0); $('#chatbox_ret').toggle('normal');" style="font-size: 12px; font-family: 'trebuchet ms',serif; cursor: pointer; padding: 3px;"><span id="chatbox_ret_online" style="color: white);"><span style="font-weight: bold; color: White;">WOM Chat</span><br></span><span id="chatbox_ret_offline" style="color: white;"></span></div><iframe onload="if(cb_new) { cb_start(); cb_new=0; }" style="width: 740px; height: 400px; display: none;" marginheight="0" marginwidth="0" name="chatbox_ret" id="chatbox_ret" src="http://worldofmutants.forumotion.com/chatbox/chatbox.forum" frameborder="0" scrolling="no"></iframe></div>

Everything is turning good except the Legend thing. It still appears above the forum.



Here's the legend thing, I have no idea why it wont stick to the Group tab.




Edit:
I FIGURED OUT HOW TO FIX IT!

THANK YOU,  MARIO AND BLACK DRAGON! I REALLY DO APPRECIATE IT!  

This topic is complete.

For me work perfect , so , first time , edit your index_body

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">
                                                  <div><link href='http://fonts.googleapis.com/css?family=Seaweed+Script' rel='stylesheet' type='text/css'><div style="font-family: seaweed script; text-align: none;">{L_USERNAME}</div></span> </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" scope="{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></span>
            <!-- END switch_user_logged_in -->
            <!-- BEGIN switch_delete_cookies -->
            <br /><span class="gensmall"><a href="{switch_delete_cookies.U_DELETE_COOKIES}" class="gensmall">{switch_delete_cookies.L_DELETE_COOKIES}</a></span>
            <!-- END switch_delete_cookies -->
        </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"><link href='http://fonts.googleapis.com/css?family=Economica' rel='stylesheet' type='text/css'><div style="font-family: economica;">{L_USERNAME}</div>:</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" scope="{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 -->
  <div id="tabs_container">
    <ul id="stabs">
        <li class="active"><a href="#tab1">Statistics</a></li>
        <li><a href="#tab2">Who is online</a></li>
    </ul>
</div>
 
  <div id="tabs_content_container">
    <div id="tab1" class="tab_content" style="display: block;">
        <p>{TOTAL_POSTS}<br />
        {TOTAL_USERS}<br />
        {NEWEST_USER}</p>
    </div>
    <div id="tab2" class="tab_content">
        <p><span class="gensmall">{TOTAL_USERS_ONLINE}<br />
        {RECORD_USERS}<br />
        <br />
        {LOGGED_IN_USER_LIST}</span>

          {L_CONNECTED_MEMBERS}
    {L_WHOSBIRTHDAY_TODAY}
    {L_WHOSBIRTHDAY_WEEK}</p>
    </div>
</div>

<!-- 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,
    oauth: true
});
//]]>
          </script><br />
<!-- END switch_fb_index_login -->
         
<!--AFFILIATES OF OUR SITE! DO NOT ALTER OR DELETE-->
         
   
    <table>
    <tr>
    <th>Affiliates</th>
    </tr>
    <tr>
      <td>
         
<a href="http://www.rpg-directory.com/" target="_blank"><img src="http://rpg-directory.com/images/affiliate.png"/></a>
<a href="http://onemassivelyfungame.com" target="_blank"><img src="http://onemassivelyfungame.com/omfgmini1.jpg"/></a>
<a href="http://superhero-rpg.forum-motion.com/" target="_blank"><img src="http://i11.servimg.com/u/f11/17/76/90/33/affili11.gif"/></a>   
<a href="http://z9.invisionfree.com/nexus_rpg" target="_blank"><img src="http://i305.photobucket.com/albums/nn226/nexus616/button.jpg"/></a>   
<a href="http://z4.invisionfree.com/Xrevolution" Target="_blank"><img src="http://i9.photobucket.com/albums/a75/amayademorte/xmen/X-Button.jpg"/></a>   
<a href="http://totaldramawebsite.net" target="_blank"><img src="http://totaldramawebsite.net/wordpress/wp-content/uploads/2011/12/aniexchbutton2.gif"/></a>     
<a href="http://a1000years.forumotion.com" target="_blank"><img src="http://i81.servimg.com/u/f81/18/27/77/43/aty20115.png"/></a>     
<a href="http://sw-lostrepublic.forumotion.com/" target="_blank"><img src="http://i12.servimg.com/u/f12/17/99/30/90/sw_aff10.png" height="31" width="88"/></a>     
<a href="http://z13.invisionfree.com/thewalkingdead2/index.php" target="_blank"><img src="http://i947.photobucket.com/albums/ad312/bloodonthe/walkingdeadbann-3.png"/></a> 
<a href="http://a-new-age.forumotion.com" target="_blank"><img src="http://i17.servimg.com/u/f17/17/48/02/71/a_new_10.png"/></a>     
<a href="http://z13.invisionfree.com/embracing_destiny"target="_blank"><img src="http://i1114.photobucket.com/albums/k525/tyranny19/Embracing%20Destiny/EDbutton_zpsb2e9d526.jpg"/></a>     
<a href="http://weekenders.b1.jcink.com" target="_blank"><img src='http://i95.photobucket.com/albums/l156/pinkrevolvers/weekenders/wwbutton7.gif' alt='Weekend Warriors' /></a>
<a href="http://athrivingworld.proboards.com" target="_blank"><img src="http://i1124.photobucket.com/albums/l574/athrivingworld/thrivingworld1-2.png"/></a>     
<a href="http://beautifultragedy.b1.jcink.com" target="_blank"><img src="http://i.imgur.com/KLA7SB1.png"/></a>
      </td>
      </tr>
    </table>
             
<!--AFFILIATES END-->
     
      <!--CHATBOX POP-UP BEGINS-->
          <div id="chatbox_ret_cont" onmouseout="stopINT()" onclick="stopINT()" onmousever="stopINT()" style="border-top: 7px solid rgb(000, 00, 00); border-left: 7px solid rgb(000, 00, 00); z-index: 10000; -moz-border-radius: 20px 0pt 0pt 0pt; background-color: #FB000D; position: fixed; bottom: 0pt; right: 0pt; border-color: #FB000D;"><div onclick="(document.getElementById('chatbox_ret').style.display=='block')?my_setcookie('chatbox_ret','0',0,0):my_setcookie('chatbox_ret','1',1,0); $('#chatbox_ret').toggle('normal');" style="font-size: 12px; font-family: 'trebuchet ms',serif; cursor: pointer; padding: 3px;"><span id="chatbox_ret_online" style="color: white);"><span style="font-weight: bold; color: White;">WOM Chat</span><br></span><span id="chatbox_ret_offline" style="color: white;"></span></div><iframe onload="if(cb_new) { cb_start(); cb_new=0; }" style="width: 740px; height: 400px; display: none;" marginheight="0" marginwidth="0" name="chatbox_ret" id="chatbox_ret" src="http://worldofmutants.forumotion.com/chatbox/chatbox.forum" frameborder="0" scrolling="no"></iframe></div>

Now , you need just to use the CSS and HTML from the tutorial , it is tested by me and isn't possible to don't work.

Please try this code! Remove the last one and place this one:

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">
                                                <div><link href='http://fonts.googleapis.com/css?family=Seaweed+Script' rel='stylesheet' type='text/css'><div style="font-family: seaweed script; text-align: none;">{L_USERNAME}</div></span> </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" scope="{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></span>
          <!-- END switch_user_logged_in -->
          <!-- BEGIN switch_delete_cookies -->
          <br /><span class="gensmall"><a href="{switch_delete_cookies.U_DELETE_COOKIES}" class="gensmall">{switch_delete_cookies.L_DELETE_COOKIES}</a></span>
          <!-- END switch_delete_cookies -->
      </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"><link href='http://fonts.googleapis.com/css?family=Economica' rel='stylesheet' type='text/css'><div style="font-family: economica;">{L_USERNAME}</div>:</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" scope="{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 -->[/color]


<!-- BEGIN disable_viewonline -->[/color]


<div id="tabs_container">
<ul id="stabs">
<li class="active"><a href="#tab1">Statistics</a></li>
      <li><a href="#tab2">Who is Online</a></li>
    <li><a href="#tab3">Birthdays</a></li>
<li><a href="#tab4">About us</a></li>

<li><a href="#tab5">Copyright</a></li>

<li><a href="#tab6">Member Groups</a></li>

</ul>
</div>
<div id="tabs_content_container">
    <div id="tab1" class="tab_content" style="display: block;">
        <p><span class="gensmall">{TOTAL_POSTS}<br />
      {TOTAL_USERS}<br />
      {NEWEST_USER}</span></p>
    </div>
    <div id="tab2" class="tab_content">
        <p><span class="gensmall">{TOTAL_USERS_ONLINE}<br />
      {RECORD_USERS}<br />
      <br />
      {LOGGED_IN_USER_LIST}</span>
  </tr>
        {L_CONNECTED_MEMBERS}</p>
    </div>
    <div id="tab3" class="tab_content">
        <p> {L_WHOSBIRTHDAY_TODAY}
  {L_WHOSBIRTHDAY_WEEK}</p>
    </div>
<div id="tab4" class="tab_content">
        <p>The about us informations go here.</p>
    </div>
<div id="tab5" class="tab_content">
        <p>The Copyrights of the forum goes here.</p>
    </div>
<div id="tab6" class="tab_content">
        <p><link href='http://fonts.googleapis.com/css?family=Montserrat+Alternates' rel='stylesheet' type='text/css'><div style="font-family: montserrat alternates; text-align: none;">{LEGEND} : {GROUP_LEGEND}</p>
    </div>
</div>


  <!-- BEGIN switch_chatbox_activate -->
  <tr>
      <td class="row1">
                <span class="gensmall"><div><link href='http://fonts.googleapis.com/css?family=Montserrat+Alternates' rel='stylesheet' type='text/css'><div style="font-family: montserrat alternates; text-align: none;">{TOTAL_CHATTERS_ONLINE}</div> :  {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}', '<div><link href='http://fonts.googleapis.com/css?family=Montserrat+Alternates' rel='stylesheet' type='text/css'><div style="font-family: montserrat alternates; text-align: none;">{L_CLICK_TO_JOIN_CHAT}');</div>
              //]]>
              </script>
              <!-- END switch_chatbox_popup -->
          </span>
      </td>
  </tr>
  <!-- END switch_chatbox_activate -->
</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,
  oauth: true
});
//]]>
        </script><br />
<!-- END switch_fb_index_login -->
       
<!--AFFILIATES OF OUR SITE! DO NOT ALTER OR DELETE-->
       
 
  <table>
  <tr>
  <th>Affiliates</th>
  </tr>
  <tr>
    <td>
       
<a href="http://www.rpg-directory.com/" target="_blank"><img src="http://rpg-directory.com/images/affiliate.png"/></a>
<a href="http://onemassivelyfungame.com" target="_blank"><img src="http://onemassivelyfungame.com/omfgmini1.jpg"/></a>
<a href="http://superhero-rpg.forum-motion.com/" target="_blank"><img src="http://i11.servimg.com/u/f11/17/76/90/33/affili11.gif"/></a>   
<a href="http://z9.invisionfree.com/nexus_rpg" target="_blank"><img src="http://i305.photobucket.com/albums/nn226/nexus616/button.jpg"/></a>   
<a href="http://z4.invisionfree.com/Xrevolution" Target="_blank"><img src="http://i9.photobucket.com/albums/a75/amayademorte/xmen/X-Button.jpg"/></a>   
<a href="http://totaldramawebsite.net" target="_blank"><img src="http://totaldramawebsite.net/wordpress/wp-content/uploads/2011/12/aniexchbutton2.gif"/></a>     
<a href="http://a1000years.forumotion.com" target="_blank"><img src="http://i81.servimg.com/u/f81/18/27/77/43/aty20115.png"/></a>     
<a href="http://sw-lostrepublic.forumotion.com/" target="_blank"><img src="http://i12.servimg.com/u/f12/17/99/30/90/sw_aff10.png" height="31" width="88"/></a>     
<a href="http://z13.invisionfree.com/thewalkingdead2/index.php" target="_blank"><img src="http://i947.photobucket.com/albums/ad312/bloodonthe/walkingdeadbann-3.png"/></a> 
<a href="http://a-new-age.forumotion.com" target="_blank"><img src="http://i17.servimg.com/u/f17/17/48/02/71/a_new_10.png"/></a>     
<a href="http://z13.invisionfree.com/embracing_destiny"target="_blank"><img src="http://i1114.photobucket.com/albums/k525/tyranny19/Embracing%20Destiny/EDbutton_zpsb2e9d526.jpg"/></a>     
<a href="http://weekenders.b1.jcink.com" target="_blank"><img src='http://i95.photobucket.com/albums/l156/pinkrevolvers/weekenders/wwbutton7.gif' alt='Weekend Warriors' /></a>
<a href="http://athrivingworld.proboards.com" target="_blank"><img src="http://i1124.photobucket.com/albums/l574/athrivingworld/thrivingworld1-2.png"/></a>     
<a href="http://beautifultragedy.b1.jcink.com" target="_blank"><img src="http://i.imgur.com/KLA7SB1.png"/></a>
    </td>
    </tr>
  </table>
           
<!--AFFILIATES END-->
   
    <!--CHATBOX POP-UP BEGINS-->
        <div id="chatbox_ret_cont" onmouseout="stopINT()" onclick="stopINT()" onmousever="stopINT()" style="border-top: 7px solid rgb(000, 00, 00); border-left: 7px solid rgb(000, 00, 00); z-index: 10000; -moz-border-radius: 20px 0pt 0pt 0pt; background-color: #FB000D; position: fixed; bottom: 0pt; right: 0pt; border-color: #FB000D;"><div onclick="(document.getElementById('chatbox_ret').style.display=='block')?my_setcookie('chatbox_ret','0',0,0):my_setcookie('chatbox_ret','1',1,0); $('#chatbox_ret').toggle('normal');" style="font-size: 12px; font-family: 'trebuchet ms',serif; cursor: pointer; padding: 3px;"><span id="chatbox_ret_online" style="color: white);"><span style="font-weight: bold; color: White;">WOM Chat</span><br></span><span id="chatbox_ret_offline" style="color: white;"></span></div><iframe onload="if(cb_new) { cb_start(); cb_new=0; }" style="width: 740px; height: 400px; display: none;" marginheight="0" marginwidth="0" name="chatbox_ret" id="chatbox_ret" src="http://worldofmutants.forumotion.com/chatbox/chatbox.forum" frameborder="0" scrolling="no"></iframe></div>

Thank you all. I appreciate all your help. Topic solved

Glad to help!!