Staff online widget help.

So I added the staff online widget and it worked but...
http://rubbershinobi.forumotion.com/
It shows the whole staff list even offline. And it looks ugly.
Also,when I added the widget,I noticed that it cut out some of my topic images. How can I fix this?
Any help?

where did you get this widget? .. provide a link if u can

do you color your staff names?

No

well i can write you a better code but you have 2 choices either you can fill in all of your staffs user id's or you can color them and just fill in the colors

Writing me one is fine plz.

witch way do you want it by color or userid#

Userid#

see if this works for you

Code:


<style>
#staffwidget img{width:40px;border-radius:8px}
#staffwidget .stonh{border:1px solid white;padding: 2px;border-radius: 5px;width:97%;}
#staffwidget a{text-align:center;width:100%;}
#staffwidget #innerstname{width: 100% !important;display: inline-flex;font-size: 1.10em;font-weight: bold;}
</style>
<div id="staffwidget">
</div><script>
jQuery(function(){
fff = ['1','87294','3975','98818','12726','97664']; // id's of the staff
jQuery('body').append('<span id="staffget" style="display:inline;"></span>');
jQuery('#staffget').load('/viewonline .forumbg',function(){
jQuery('#staffget a[href^="/u"]').each(function(){
   var prof = jQuery(this).attr('href');

for(var i = 0; i < fff.length; i++){
if(prof == '/u'+fff[i]){
   jQuery('#staffwidget').append(' <div id="stonlin'+i+'" class="stonh"><span id="innerstname">'+jQuery(this).parent().html()+'</span><br><span id="innerstava"></span><br></div> ');
jQuery('#staffwidget #stonlin'+i+' #innerstava').load(prof + ' #profile-advanced-right .inner:eq(0) div:eq(1)');
}};});});});
</script>


fff = ['1','87294','3975','98818','12726','97664']; // id's of the staff

thats the list of user id#'s you can have as little ['1'] or as many ['1','2','3'] as you need

Didn`t work.

Bump.

Hello @swagbito,

Try changing your widget to this :

Code:

 <script type="text/javascript">
    myStaff = ['1', '2'];
    staff_cache_time = 4*60*1000; // mm*ss*ms;
    </script>
<div id="theStaff">
</div>
 
<style type="text/css">
.monAva img {
  height:25px;
  width:25px;
}
.myStaff a {
  display:inline-block;
  vertical-align:top;
  margin-top:.75em;
}
</style>
<div style="display:none" id="theContent">
</div>
    <noscript><div style="color:red;font-size:9px">Functionality of this widget is not possible, as JavaScript is disabled or unsupported.</div></noscript>    <script type="text/javascript">
    if (localStorage.staffOn && localStorage.staffEx > +new Date - staff_cache_time) jQuery('#theStaff').html(localStorage.staffOn);
    else loadStaff();
    function loadStaff() {
      jQuery('#theContent').load('/viewonline #main-content a, a.gen', function() {
        for (i=0; i<myStaff.length; i++) jQuery('#theContent a').filter(function() { return jQuery(this).attr('href') === '/u' + myStaff[i] }).appendTo('#theStaff').wrap('<div class="myStaff">');
        if (!jQuery('#theStaff .myStaff').length) jQuery('#theStaff').html('No staff online');
        jQuery('.myStaff a').each(function() {
          var href = jQuery(this).attr('href');
          jQuery(this).before('<span class="monAva"></span>').prev().load(href + ' #profile-advanced-right .module:first div img:first,.forumline td.row1.gensmall:first > img, .frm-set.profile-view.left dd img,dl.left-box.details:first dd img, .row1 b .gen:first img, .real_avatar img', function() {
            if (window.localStorage) {
              localStorage.staffOn = jQuery('#theStaff').html();
              localStorage.staffEx = +new Date;
            }
          });
        });
      });
    }
    </script>

myStaff = ['1', '2']; Is the list of your staff
replace 1, 2 by the id of your staff, you can add more than two by separating multiple user IDs by a comma. To get their id go to their profile and look for /u# in the address bar, # being their ID.

staff_cache_time = 4*60*1000; Is the time the widget is cached