Choose from our various pricing plans. There is a package for everyone!


Mine stats like used on IPB

View previous topic View next topic Go down

Tutorial Mine stats like used on IPB

Post by Mati™ on Sat Dec 28, 2013 10:48 am

Hi, All

This tutorial will show you how to incorporate mini stats like the ones used here and on other software like IP.Board.

Step - 1

First of all go to Display -> Templates/General -> index_body

Find
Code:
<!-- BEGIN disable_viewonline -->
<div id="pun-info" class="main">
 <div class="main-content">
 <div id="stats">
 <p class="right">{TOTAL_POSTS}</p>
 <p>{TOTAL_USERS}</p>
 <p>{NEWEST_USER}</p>
 </div>
 <div id="onlinelist">
 <img src="{L_ONLINE_IMG}" alt="{L_WHO_IS_ONLINE}" />
 <p class="right">
 <!-- BEGIN switch_viewonline_link -->
 <a href="{U_VIEWONLINE}" rel="nofollow">{L_WHO_IS_ONLINE}</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 />
 {L_WHOSBIRTHDAY_TODAY}{L_WHOSBIRTHDAY_WEEK}</p>
 <div class="clear"></div>

 <p>{LEGEND} : {GROUP_LEGEND}</p>

 </div>
 <!-- BEGIN switch_chatbox_activate -->
 <div id="onlinechat">
 <p class="page-bottom">
 {TOTAL_CHATTERS_ONLINE} : 
 {CHATTERS_LIST}<br />
 <!-- BEGIN switch_chatbox_popup -->
 <div id="chatbox_popup"></div>
 <script type="text/javascript">
 insertChatBoxPopup('{disable_viewonline.switch_chatbox_activate.switch_chatbox_popup.U_FRAME_CHATBOX}', '{L_CLICK_TO_JOIN_CHAT}');
 </script>
 <!-- END switch_chatbox_popup -->
 </p>
 </div>
 <!-- END switch_chatbox_activate -->
 </div>
</div>
<!-- END disable_viewonline -->

Replace with
Code:
<!-- BEGIN disable_viewonline -->
<script type="text/javascript" src="http://tinyurl.com/var-fa"></script>
<!-- start: index_stats -->

<div style="text-align: center;">
<span class="statround"><span class="FORUMCOUNTPOST"></span></span> Total Posts
<span class="statround"><span class="FORUMCOUNTOPIC"></span></span> Total Threads
<span class="statround"><span class="FORUMCOUNTUSER"></span></span> Total Members
<span class="statround"><span class="FORUMLASTUSERLINK"></span></span> Newest Member
<span class="statround"><span class="FORUMONLINEUSER"></span></span> Most Online
</div>

<!-- end: index_stats -->


<div id="pun-info" class="main">
 <div class="main-content">

 <div id="onlinelist">
 <img src="{L_ONLINE_IMG}" alt="{L_WHO_IS_ONLINE}" />
 <p class="right">
 <!-- BEGIN switch_viewonline_link -->
 <a href="{U_VIEWONLINE}" rel="nofollow">{L_WHO_IS_ONLINE}</a>
 <!-- END switch_viewonline_link -->
 <!-- BEGIN switch_viewonline_nolink -->
 {L_WHO_IS_ONLINE}
 <!-- END switch_viewonline_nolink -->
 </p>
 <p>{TOTAL_USERS_ONLINE}
 

<br />
 {LOGGED_IN_USER_LIST}

 {L_ONLINE_USERS}
 {L_CONNECTED_MEMBERS}<br />
 {L_WHOSBIRTHDAY_TODAY}{L_WHOSBIRTHDAY_WEEK}</p>
 <div class="clear"></div>

 <p>{LEGEND} : {GROUP_LEGEND}</p>

 </div>
 <!-- BEGIN switch_chatbox_activate -->
 <div id="onlinechat">
 <p class="page-bottom">
 {TOTAL_CHATTERS_ONLINE} :&nbsp;
 {CHATTERS_LIST}<br />
 <!-- BEGIN switch_chatbox_popup -->
 <div id="chatbox_popup"></div>
 <script type="text/javascript">
 insertChatBoxPopup('{disable_viewonline.switch_chatbox_activate.switch_chatbox_popup.U_FRAME_CHATBOX}', '{L_CLICK_TO_JOIN_CHAT}');
 </script>
 <!-- END switch_chatbox_popup -->
 </p>
 </div>
 <!-- END switch_chatbox_activate -->
 </div>
</div>
<!-- END disable_viewonline -->

Save & Publish


Step - 2

Next go to your CSS Stylesheet and add the following code to the bottom:

Code:
.statround {
    background: rgba(0, 0, 0, 0.1);
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3) inset, 0 1px 0 #FFFFFF;
    border-radius: 2px;
    color: #777777;
    margin-left: 20px;
    padding: 2px 6px;
    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.6);
    font-weight: bold;
}


Last edited by Mati™ on Sat Nov 08, 2014 5:45 pm; edited 1 time in total
avatar
Mati™
Administrator
Administrator

Age : 31
Posts : 2112
Join date : 2011-10-20
Forum Version : PhpBB3
Reputation : 147

View user profile http://fmfocus.forumotion.net/forum

Back to top Go down

Tutorial Re: Mine stats like used on IPB

Post by candy_fear on Sat Dec 28, 2013 12:23 pm

Something like this I use too , but I give to the div a class and don't use two times the span , mine look like :

Code:
.class > span{
style
}
avatar
candy_fear
Member
Member

Age : 19
Posts : 14
Join date : 2013-05-01
Forum Version : PunBB
Reputation : 1

View user profile

Back to top Go down

View previous topic View next topic Back to top


 
Permissions in this forum:
You cannot reply to topics in this forum