javascript to split the online users so i can style each one in css

i want to take the online users and split them and give each one a class so i can style each one in my css to make a custom online users section

Example

take this

In total there is 1 user online :: 1 Registered, 0 Hidden and 0 Guests



make it like this


<div class="users1">1 Registered</div>
<div class="users2">0 Hidden</div>
<div class="users3">0 Guests</div>


i have tried to figure this out on my own but i am not very good at js yet

Hello thetwistedkilla,

Could you provide what forum version you're using ?

Thanks

it says on my profile on side but its phpbb2 ..but it dont matter what version u do it under i can switch the elements to the correct ones if you do it for a different version

Sorry, I like to make sure since members tend to have multiple forums.

Go to Administration Panel > Display > Templates > General > index_body

Find :

Code:

<tr>
 <td class="row1"><span class="gensmall">{TOTAL_USERS_ONLINE}<br />
 {RECORD_USERS}<br />
 <br />
 {LOGGED_IN_USER_LIST}</span></td>
 </tr>

Replace by :

Code:

<tr>
          <td class="row1"><span id="whois-on" class="gensmall">{TOTAL_USERS_ONLINE}<br />
 {RECORD_USERS}<br />
 <br />
 {LOGGED_IN_USER_LIST}</span>
                <script type="text/javascript">(function() {
                  var who = document.getElementById('whois-on');
                  who.innerHTML = who.innerHTML.replace(/(\d+ Registered)/,'<span class="users1">$1</span>').replace(/(\d+ Hidden)/,'<span class="users2">$1</span>').replace(/(\d+ Guests)/,'<span class="users3">$1</span>');
                })();</script>
          </td>
 </tr>

Save and publish.

Then you should be able to style them with the classes you wanted.

ty that works awesome...solved.. i think i can figure out rest now im try put it in tables and so on ... if u leave this open ill post my finished result or you can close it and ill send it to you and you can make a tutorial out of it or something

You're welcome. ^^

Topic archived