Modify Staff Online Widget
3 posters
Page 1 of 1
Modify Staff Online Widget
After figuring out how to make this widget possible, I'd like to know if it can be modified to not show members who are currently offline. I intend to use profile images to go along with the names of the staff members, but in doing this, too much space will be taken up. So I have resorted to the idea of this new parameter.
Thanks in advance.
- Code:
<style>.staffname{display:block}</style><div id="onlineStaff">
<span class="staffname">MEMBER NAME</span>
<span class="staffname">MEMBER NAME</span>
<span class="staffname">MEMBER NAME</span>
<span class="staffname">MEMBER NAME</span>
<span class="staffname">MEMBER NAME</span>
</div>
<script type="text/javascript">
jQuery(function() {
var x = document.getElementById('left').getElementsByTagName('table')[1];
var y = document.getElementById('onlineStaff').getElementsByTagName('span');
for (i=0; i<y.length; i++) {
if (x.innerHTML.indexOf(y[i].innerHTML) > 0) y[i].innerHTML+=' <img src="'+'http://imageshack.us/a/img198/4198/onlinebg.png'+'">';
else y[i].innerHTML+=' <img src="'+'http://imageshack.us/a/img812/4033/offlinezn.png'+'">'; } });
</script>
Thanks in advance.
Last edited by P-Robs on June 7th 2013, 3:42 am; edited 1 time in total
Re: Modify Staff Online Widget
- Designer's habits:
- Ew. You really have to do smth with your text effects on logo and this kind of images. I advise you to disable filter 'bevel and emboss' and choose a more readable font.
Use such a code:
- Code:
<style>.staffname{display:none}</style><div id="onlineStaff">
Staff online:
<span class="staffname">MEMBER NAME</span>
<span class="staffname">MEMBER NAME</span>
<span class="staffname">MEMBER NAME</span>
<span class="staffname">MEMBER NAME</span>
<span class="staffname">MEMBER NAME</span>
</div>
<script type="text/javascript">
jQuery(function() {
var x = document.getElementById('left').getElementsByTagName('table')[1];
var y = document.getElementById('onlineStaff').getElementsByTagName('span');
for (i=0; i<y.length; i++) {
if (x.innerHTML.indexOf(y[i].innerHTML) > 0) y[i].style.display ='block';
} });
</script>
But this uses statistics widget which is needed to be placed at the top.
The code is too primitive...
Tell us if all this works.
Nostra- Forumember
- Posts : 30
Reputation : 3
Language : .it
Location : Neverland
Re: Modify Staff Online Widget
Nostra wrote:
- Designer's habits:
Ew. You really have to do smth with your text effects on logo and this kind of images. I advise you to disable filter 'bevel and emboss' and choose a more readable font.
CODE REMOVED FROM QUOTE
But this uses statistics widget which is needed to be placed at the top.
The code is too primitive...
Tell us if all this works.
Firstly, I welcome the criticism on the imagery and will consider having my graphics designer redesign. Secondly, The code you provided did not perform the way I am wanting. I still want the images that I provided in the code to be in the widget. Your code does not remove the usernames that are currently offline. All I am wanting is for it to not display the names unless they are online.
I am thinking that if this portion of the jquery is modified, else y[i].innerHTML+=' <img src="'+'https://2img.net/r/ihimg/a/img812/4033/offlinezn.png'+'">';, then it should work properly. But I am unable to figure it out. If anyone is able to help, I'd sure appreciate it.
Re: Modify Staff Online Widget
- Lalala...:
- omg, in this case u should do smth with ur designer.
If I were you I would choose an existing skin on hitskin and just place your logo... But I'm a designer and do all styles by myself
Whoops, it needs "Who is online" widget, not "Statistics" XD
I gonna make some tests and write my own code...
...and I wrote it.
I have such a code (grab it):
- Code:
<style>
#onlinestaff a {
display: none;
}
</style><div id="onlinestaff">
<b>Staff online:</b>
<a href="http://your.forum.com/u1">Admin</a>
<a href="http://your.forum.com/u2">A guy</a>
<a href="http://your.forum.com/u3">Another guy</a>
<a href="http://your.forum.com/u4">And one more</a>
</div>
<script type="text/javascript">
jQuery(document).ready (function () {
jQuery('table.forumline').not('#left .forumline').not('#right .forumline').last().find('tr:eq(2) span.gensmall a').each(function () {
jQuery('#onlinestaff a[href="' + this.href + '"]').css('display','block');
});
});
</script>
And, having only Admin user online, I get a such picture:
This needs to be placed in adminpanel - display - homepage - generalities - Homepage message.
Give links to needed users:
- Code:
<a href="http://your.forum.com/u1">Admin</a>
If you need I can adapt it so it will work on other pages too.
Avatar images can be added too.
Nostra- Forumember
- Posts : 30
Reputation : 3
Language : .it
Location : Neverland
Re: Modify Staff Online Widget
- Continued Design Convo:
- Thank you for the criticism. I don't necessarily want to use something that someone else is using (Hitskin). The intent is for this forum to be a one of a kind since there are multitudes of forums that are created for the same purpose as my own. For this reason, I want a custom theme for my forum. It is also the same reason why my forum is currently 'locked' and not allowing new members. I will probably be looking into the hitskins further to see if there is anything that I like. If you wish, feel free to come up with some things for me via PM.
I am trying out your newest code at this time. I would also like to inform you that there is more coding involved with this widget/application. So I am hoping that nothing conflicts.
You stated that avatars can be used. In order to accommodate for this, would i replace the name used with the avatar image, or would I have to keep the name and insert the URL?
Update: The script is working correctly. However, when the panel is opened to show users status, a line goes all the way across beneath the name. Can this be removed? Also, if I deviate away from the homepage, it no longer shows any of the online users. This proves to be a big problem, for if it does this to me while I am browsing the forums, then it is doing the same for the regular members. Therefore, if they are browsing a topic, and they notice that something is wrong, they wont be able to see who is online unless they return to the homepage.
Re: Modify Staff Online Widget
These stylesheets create the border:a line goes all the way across beneath the name. Can this be removed?
You should delete 4 lines starting with 'border-bottom'.
Just add an image tag, like this:In order to accommodate for this, would i replace the name used with the avatar image, or would I have to keep the name and insert the URL?
- Code:
<a href="http://hieraticskyacademy.forumotion.com/u3" style="display: block; ">
<img src="http://r21.imgfast.net/users/2117/33/06/02/avatars/3-73.jpg"><br>
t3st3rd3ck
</a>
Try replacing the script tag with this one:if I deviate away from the homepage, it no longer shows any of the online users.
- Code:
<script type="text/javascript">
jQuery(document).ready (function () {
jQuery('#left .forumline:eq(0) .row1 a').each(function () {
jQuery('#onlinestaff a[href="' + this.href + '"]').css('display','block');
});
});
</script>
Nostra- Forumember
- Posts : 30
Reputation : 3
Language : .it
Location : Neverland
Re: Modify Staff Online Widget
Topic Solved & Locked |
Lost Founder's Password |Forum's Utilities |Report a Forum |General Rules |FAQ |Tricks & Tips
You need one post to send a PM.
You need one post to send a PM.
When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.
Similar topics
» Staff online widget
» Staff online widget help.
» How can I make a staff online widget?
» View online Staff in a widget?
» Staff Online Widget Problem
» Staff online widget help.
» How can I make a staff online widget?
» View online Staff in a widget?
» Staff Online Widget Problem
Page 1 of 1
Permissions in this forum:
You cannot reply to topics in this forum