IP.Board Statistics pentru punBB

[StaarK* For EvEr]

Salut Tuturor,
Astazi am sa va arat cum puteti realiza foarte usor si simplu statistici asemantoare celor de pe forumurile IP.Board (IPB).
Sa incepem prin editarea template-urilor.
PA > Afisare > Template-uri > General > index_body (Pagina de start)
Cautam:

Cod:

<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>

Si inlocuim cu:

Cod:

<div id="pun-info" class="main">
      <div id="board_stats">
         <ul class="ipsType_small ipsList_inline">
                          <li class="clear"><span>{TOTAL_POSTS}</span> Total posturi</li>
           <li class="clear"><span>{TOTAL_USERS}</span> Total membrii</li>
                          <li class="clear"><span>{NEWEST_USER}</span> Cel mai nou membru</li>
                          <li class="clear" data-tooltip="{FORUMONLINEDATE}"><span>{RECORD_USERS}</span> Cei mai mulți conectați</li>
                  </ul>
      </div>
      <div id="board_statistics" class="statistics clearfix">
                        <h4 class="statistics_head"> utilizatori conectați (în ultimele 15 minute)</h4>
                     <ul id="stat_links" class="ipsList_inline right ipsType_small"><!-- Hook point --><li><a href="#" title="Vezi echipa de gestionare">Echipa de gestionare</a></li><li><a href="#" title="Vezi top 20 respondenți de astăzi">Top 20 respondenți de astăzi</a></li><li><a href="#" title="Vezi top general respondenți ai siteului">Top general respondenți</a></li><li><a href="#"> Most Liked Content</a></li></ul>
         <br />
                   {TOTAL_USERS_ONLINE}<br />
         <br />
         {LOGGED_IN_USER_LIST}
         {L_ONLINE_USERS}
                  </div>

Pasul 2: (CSS)
PA > Afisare > Imagini si culori > Culori > Foaie de stil CSS

Cod:

.statistics {
margin: 20px 0 0 0;
padding: 10px 0;
border-top: 3px solid #D8D8D8;
line-height: 1.3;
overflow: hidden;
}

.right {
float: right;
}

.ipsType_small.ipsList_inline li span {
font-size: 0px;
}

.ipsType_small.ipsList_inline li span strong {
font-size: 12px;
display: inline;
background: #E2E2E2;
color: #4A4A4A;
padding: 2px 6px;
font-weight: bold;
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
border-radius: 2px;
margin-right: 3px;
}

.ipsType_small {
font-size: 10px;
color: #225985;
text-decoration: none;
}

#stat_links li {
display: inline;
margin-left: 10px;
}

.statistics_brief.desc p {
font-size: 10px !important;
color: #777;
}


#board_statistics + .h3 {
display: none;
}

#board_stats ul {
text-align: center;
}

#board_stats li {
margin-right: 20px;
display: inline;
}

#board_stats .value {
display: inline;
background: #E2E2E2;
color: #4A4A4A;
padding: 2px 6px;
font-weight: bold;
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
border-radius: 2px;
margin-right: 3px;
}

#board_stats {
margin-top: 20px;
}

a, a:hover {
text-decoration: none;
}

#stat_links {
margin-top: -15px;
}

Pasul 3. (JS) - Ultimul pas.
PA > Module > HTML & JAVASCRIPT > Gestiunea codurilor JavaScript > Coduri JavaScript
( Activeaza gestiunea codurilor JavaScript :DA ) >

Cod:

$(document).ready(function() {
var x=$('#board_statistics')[0];
if(x) {x.innerHTML=x.innerHTML.replace(/In total este/,' ');}
});

$(document).ready(function() {
var x=$('#board_statistics')[0];
if(x) {x.innerHTML=x.innerHTML.replace(/Utilizatori inregistrati:/,' ');}
});

$(document).ready(function() {
var x=$('#board_statistics')[0];
if(x) {x.innerHTML=x.innerHTML.replace(/In total sunt/,' ');}
});

$(document).ready(function() {
var x=$('#board_statistics')[0];
if(x) {x.innerHTML=x.innerHTML.replace(/utilizator conectat:/,' ');}
});

$(document).ready(function() {
var x=$('#board_statistics')[0];
if(x) {x.innerHTML=x.innerHTML.replace(/utilizatori conectati:/,' ');}
});

$(document).ready(function() {
$('#board_statistics strong').first().prependTo('.statistics_head');
});

Amplasare: Indexul Forumului

Enjoy.
Demo: https://i.servimg.com/u/f48/17/78/47/82/snapsh10.png

Tutorial realizat de InFeRn0
Acest tutorial v-a fost oferit de catre Extream-Suport. Distribuirea lui, precum si plagierea integrala fara acordul staff-ului este interzisa si se sanctioneaza conform coditiilor de utilizare Forumgratuit.ro.