Forum Statistics thống kê thành viên online giống Tech24h.vn

Không biết gọi thế nào nên để vậy , riêng mình thì thấy nó giống của vbb hơn .
Chức năng: thống kê số lượng thành viên online, hiển thị staf online riêng, thống kế đề tài, bài viết, tổng số thành viên, thành viên mới nhất.
Demo site: http://tech24h.vn (kéo xuống dưới cùng)
do style hơi vuông và phẳng nên làm nó theo kiểu đấy, ai không thích thì css chỉnh lại chút
Demo ảnh:
Bước 1: tạo template footer_stats với nội dung sau

Mã:

<xen:require css="footer_stats.css" />

<div class="borderwrapper">
    <div class="stats_body">
        <h3 class="stats_title_right"><a href="online/" class="Tooltip" title="See all online users">{xen:phrase online_now_x_members_y_guests_z, 'total={xen:number $onlineUsers.total}', 'members={xen:number $onlineUsers.members}', 'guests={xen:number $onlineUsers.guests}'}</a></h3>
            <div id="stats_content">
            <xen:if hascontent="true">
                <h4 class="minorHeading">{xen:phrase staff_online_now}</h4>
            <ul class="staffonlinelist">
                <xen:contentcheck>
                    <xen:foreach loop="$onlineUsers.records" value="$user">
                        <xen:if is="{$user.is_moderator} OR {$user.is_admin}">
                            <li title="{$user.username}" class="Tooltip">
                                <xen:avatar user="$user" size="s" img="true" />
                            </li>
                        </xen:if>
                    </xen:foreach>
                </xen:contentcheck>
            </ul>
        <div style="clear:both;"></div>
        </xen:if>
        <h4 class="minorHeading"><a href="{xen:link members}">{xen:phrase members}:</a></h4>
            <xen:if is="{$onlineUsers.records}">
            <ol class="listInline">
            <xen:foreach loop="$onlineUsers.records" value="$user" i="$i">
                <xen:if is="{$i} <= {$onlineUsers.limit}">
                    <li>
                    <xen:if is="{$user.user_id}">
                        <a href="{xen:link members, $user}"
                            class="username{xen:if '!{$user.visible}', ' invisible'}{xen:if {$user.followed}, ' followed'}">{xen:helper richUserName, $user}</a><xen:if is="{$i} < {$onlineUsers.limit}">,</xen:if>
                    <xen:else />
                        {xen:phrase guest}<xen:if is="{$i} < {$onlineUsers.limit}">,</xen:if>
                    </xen:if>
                    </li>
                </xen:if>
            </xen:foreach>
            <xen:if is="{$onlineUsers.recordsUnseen}">
                <li class="moreLink">... <a href="{xen:link online}" title="{xen:phrase see_all_visitors}">{xen:phrase and_x_more, 'count={xen:number $onlineUsers.recordsUnseen}'}</a></li>
            </xen:if>
            </ol>
            </xen:if>
        <br />
      <marquee> <ul>
            <li>
                <span style="font-weight: bold; color: red;">Administrator</span></a> |
                <span style="font-weight: bold; color: blue;">Super Moderator</span> |
                <span style="font-weight: bold; color: green;">Moderator</span> |
                <span style="color: purple; font-weight: bold;">V.I.P</span> |
                <span style="color: black; font-weight: bold;">Members</span>
            </li>
        </ul>
        </marquee>
        </div>
    </div>
</div>
<div id="board_stats" class="breadBoxBottom">
    <ul class="ipsType_small ipsList_inline">
        <span class="value">{xen:number $boardTotals.discussions}</span>{xen:phrase discussions}
        <span class="value">{xen:number $boardTotals.messages}</span>{xen:phrase messages}
        <span class="value">{xen:number $boardTotals.users}</span>{xen:phrase members_count}
        <span class="value"><xen:username user="$boardTotals.latestUser" /></a></span>{xen:phrase latest_member}
    </ul>
</div>

Bước 2: tạo template footer_stats.css với nội dung sau:

Mã:

#board_stats ul {
    text-align: center;
}
#board_stats li {
    margin-right: 20px;
}
#board_stats .value {
    background: none repeat scroll 0 0 url(rgba.php?r=0&g=0&b=0&a=25); background: none repeat scroll 0 0 rgba(0, 0, 0, 0.1); _filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#19000000,endColorstr=#19000000);
    border-radius: 3px 3px 3px 3px; -webkit-border-radius: 3px 3px 3px 3px; -moz-border-radius: 3px 3px 3px 3px; -khtml-border-radius: 3px 3px 3px 3px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3) inset, 0 1px 0 #FFFFFF; -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3) inset, 0 1px 0 #FFFFFF; -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3) inset, 0 1px 0 #FFFFFF; -khtml-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3) inset, 0 1px 0 #FFFFFF;
    color: #222222;
    display: inline-block;
    font-weight: bold;
    margin-right: 3px;
    padding: 3px 7px;
    text-shadow: 0 0 0 transparent, 0 1px 0 rgba(255, 255, 255, 0.6);
}
.borderwrapper {
    overflow: hidden;
    border: 1px solid
    rgb(215, 215, 215);
    padding: 5px;
}
.stats_body {
    width: 100%;
    float: left;
}
.stats_title_left, .stats_title_center, .stats_title_right {
    overflow: hidden;
    border-bottom: 1px solid
    #E0E0E0;
    color:
    rgb(100,100,100);
    text-align: left;
    margin: 0px;
    font-size: 11px;
    font-weight: bold;
    padding: 3px 10px;
}
#stats_content {
    font-size: 11px;
    padding: 5px 10px;
}

Bước 3: mở template forum_list tìm đoạn sau:

Mã:

<xen:sidebar>

Chèn lên trên đoạn code sau:

Mã:

<xen:include template="footer_stats" /> 

Nguồn: Hướng dẫn tạo thống kê thành viên giống Tech24h.vn
​