IP.Board Statistics pentru punBB

Scris de ionuz Vin Oct 26, 2012 10:17 pm

IP.Board Statistics pentru punBB

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) [Trebuie sa fiti înscris şi conectat pentru a vedea această imagine]
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">  <a href="{U_VIEWONLINE}" rel="nofollow">{L_WHO_IS_ONLINE}</a>   {L_WHO_IS_ONLINE}  </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"><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 ) > [Trebuie sa fiti înscris şi conectat pentru a vedea această imagine]

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: [Trebuie sa fiti inscris si conectat pentru a vedea acest link]

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