How to make Staff Icons, I know there is a way, but i can't find it.

First topic message reminder :

How to make separate staff icons for the members.
like if one is a Red Elder, And one is a blue elder, and one is a Green Elder..
to have that separate color indicator next to their name in the member list.

Or if you guys can just help me look exactly like this.
" This was photoshoped to look like exactly the way I want it "



www.SpyroDragon.com for the web link.

I think I understand the issue you are facing, something with Chrome I believe. When you copy it, look how you are coping extra space on the very left, it highlights parts without even text. Try coping each line or another browser, that should fix your issue.

Can you take a screenshot of it on your side, maybe ill copy it letter by letter.
and edit it on paint with the number of spaces

It shows up the same as yours, but look at your video when you copy the code. For each line, copy and then paste, don't copy the whole thing.

Each line is represented by a number.

Copying every line indvidualy changed the spacing as you can see int he screenshot but its still repeating.

Your code looks different again. Do you have another browswer you can use? Also, when you copied every line, did you select even the extra space on the left without moving into the left column of the code?

Yes, and i tried Chrome and Exploar , im downloading firefox atm.
i will edit this post to let you know the results.

Try typing the code:

Code:

a span[style="color:#000000"] strong {
    background:url(IMAGE LINK HERE) no-repeat;
    padding-left:16px;
}

Hit the spacebar 4 times on lines 2 and 3.

I tried it on Exploar, Chrome, and i downloaded firefox and tried it on it, and it still is repeating. how about i let you have AP for a few minutes and let you try yourself?

Okay, heading to bed soon so be very quick. Please send me a test account with admin controls, not your account via private message. Also, please delete the code that you have in Administration Panel that isn't working.

WOWOW wait a minute, it works on your test account?
Why is it showing 2 for me?


BUMM BUMM BUMM....

Wow lol! I will take a look.

I figured it out, it was because i had 2 Groups with the same Color Code.

*** FACE PALM ***

[Solved]

Thanks for the help
@Forumedic


Acualy Not Solved.. its still repeating for me..??

Can Someone Unsolv this?

SpyroDragon wrote:Can Someone Unsolv this?

Private message SLGray.

Also, can you please give the test account admin permissions so I can take a better look tomorrow on why this is happening?

I found out that its because i have a custom name color.
I tested it on one of my staff members , it worked. When i gave my staff member a custom name color, it Repeated itself.
Least we narrowed it down to what is causing this.

Something about this javascript code is causing it to clone a 2nd staff icon.

Code:

$(function(){
  multiColor(1, '<strong><font color="#ffffff">Sp</font><font color="#00ffff">yr</font><font color="#999999">o</font><font color="#00ffff"> ▀█▀ </font><font color="#ffffff">Dr</font><font color="#00ffff">ag</font><font color="#999999">on</font></strong>');

  multiColor(130, '<strong><font color="#00ff99">ᴛᴡɪʟɪ</font><font color="#0F0F0F">▀█▀</font><font color="#00ff99">ᴅʀᴀɢᴏɴ</font></strong>');
 
  function multiColor(id, html){$('a[href="/u'+id+'"] strong').not(function(){return $("img",this)[0]}).html(html)}
});

$(function(){
  multiColor(404, '<strong><font color="#00ffcc">Elviskiller </font></strong>');
 
  function multiColor(id, html){$('a[href="/u'+id+'"] strong').not(function(){return $("img",this)[0]}).html(html)}
});

Bump

the only change that i can see of the 2 codes is that the member has added a new color
and the img that is all has changed.

Give this a try

Code:

a span[style="color:#000000"] strong {    background:url(IMAGE LINK HERE); 
background-repeat:no-repeat !important;
padding-left:16px;}

Still Repeats

Hmm.. try taking out the reference to the

Code: strong

tag.

Code:

a > span[style="color:#000000"] {
  background:url(IMAGE LINK HERE);
  background-repeat:no-repeat !important;
  padding-left:16px;
}

Well that got it to stop repeating, but it moved it up Higher, is there a way to lower it ?



I found that its a browser issue, chrome their lined perfect.. on Exploar its moved up like that.

Add A padding top or bottom to the CSS code

Some thing like this

Code:

padding-top: 20px;

You can also do a -20px
So you don't have to change the
code

I was going to test it but your Sites closed

Yea Sorry about that, i don't want guest looking at it while im in the process of changing things.
id rather them look at it when im done editing.

and i tried the code, it seems to do nothing, and i also realized that
its messing up on Exploar, but is in the perfect position on chrome.

its a common problem with IE if you ask me its a crap browser always has always will be.

I'm sorry i am not any good at fixing IE browser codes

So is there any way to fix it on IE , but not mess with it on chrome?