The forum of the forums
Welcome to the Official Support Forum of Forumotion!

To take full advantage of everything offered by our forum, please log in if you are already a member, or join our community if you've not yet.



Create a free forum like this one.

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

View previous topic View next topic Go down

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

Post by _Twisted_Mods_ on October 11th 2014, 10:38 pm

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

_Twisted_Mods_
Helper
Helper

Male Posts : 2020
Reputation : 299
Language : English
Location : Ms

http://liquidcode.forumotion.com

Back to top Go down

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

Post by Ange Tuteur on October 11th 2014, 10:46 pm

Hello thetwistedkilla,

Could you provide what forum version you're using ?

Thanks Smile

Ange Tuteur
Forumaster

Male Posts : 13021
Reputation : 2683
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.forumotion.com

Back to top Go down

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

Post by _Twisted_Mods_ on October 11th 2014, 10:50 pm

Hem 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

_Twisted_Mods_
Helper
Helper

Male Posts : 2020
Reputation : 299
Language : English
Location : Ms

http://liquidcode.forumotion.com

Back to top Go down

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

Post by Ange Tuteur on October 11th 2014, 11:15 pm

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

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

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

Ange Tuteur
Forumaster

Male Posts : 13021
Reputation : 2683
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.forumotion.com

Back to top Go down

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

Post by _Twisted_Mods_ on October 11th 2014, 11:27 pm

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

_Twisted_Mods_
Helper
Helper

Male Posts : 2020
Reputation : 299
Language : English
Location : Ms

http://liquidcode.forumotion.com

Back to top Go down

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

Post by Ange Tuteur on October 11th 2014, 11:29 pm

You're welcome. ^^

Topic archived

Ange Tuteur
Forumaster

Male Posts : 13021
Reputation : 2683
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.forumotion.com

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