Changing the color of the "@"

Hey guys, So I searched a little bit about this but couldn't find anything related so I was wondering is it actually possible that I can change the "@" that appears beside my name in the chatbox without having to change the group main color? If anyone can actually help me with this code, I would be grateful

Thanks in advance

Hello CrystalSoul,

You can try this however, I do not think that will help since the style is constantly refreshed.
Display > Colors > CSS stylesheet

Code:

#chatbox_members span strong { color:red !important; }
#chatbox_members a span strong { color:inherit !important; }

Hmm Ange, Does this work for a certain member because I want to change it for only a member not for everyone in the chatbox members list

That's for all members, I don't know if that would be possible.

Ange Tuteur wrote:That's for all members, I don't know if that would be possible.

Hi

Wouldn't it be possible with Javascript? Or like specifying the u# of the user?

Regards,
Pizza Boi

Le Bump!

Well Pizza Boi, I don't know how =(

I would appreciate if someone could though

So, I tried to change it with HTML and when I previewed it, it looked perfectly fine but when I submitted it just looked the same as it was before...

Any help from the staff here? Thanks

Yea can you post the code you had success with and i will try to help you.

Code:

<li><span style="color:#FFF07D"><strong>@</strong></span> <a href="/u1" oncontextmenu="return showMenu(1,'Dovahkiin',1,2,1,2,1,event,'?archives');" onclick="return copy_user_name('Dovahkiin');" target="_blank"><span style="color:#FFF07D"><strong>Dovahkiin</strong></span></a></li>

When previewed,

When submitted,

><

Hi

Try changing @ to another symbol for awhile and see how that goes. Also, where did you put this code?

Regards,
Pizza Boi

How would the symbol actually matter? and I put it in HTML.

Hi

Hmm... you can try changing the events and target. Anyway, if that still doesn't work, I'll try to look into it in a few days since I'm busy with stuff at the moment.

Regards,
Pizza Boi

You would need to change the Visited link.
Could you provide a Test account so i can better help you.
Keep what you have and add this to your css

Code:


a:/u1:{color: #FFF07D; text-decoration: none; }
a:/u1:active {color: #FFF07D; text-decoration: none; }
a:/u1:visited {color: #FFF07D; text-decoration: none; }
a:/u1:hover {color: #FFF07D; text-decoration: none; }


Didn't work =(
I've sent you a private message.

CrystalSoul,

I have a few questions :

1. ) Are you using the default chatbox, or different one ?
2. ) What is the UID of the user you want to apply this to ?

thanks

U1 and yes, it's the default chatbox.

The default chatbox at the top or bottom of the page ?

Top of the page.

Try this :

Administration panel > modules > javascript codes management > create a new script

title : what you wish
placement : in the homepage
paste the code below and save :

Code:

$(function() {
    if (document.getElementById('frame_chatbox')) {
       $('#frame_chatbox').before('<iframe id="frame_chatbox" width="100%" height="100%" style="border:none;" src="/chatbox/index.forum">').remove();
    }
    $('#frame_chatbox').load(function() {
        setInterval(function() {
           if ($('#frame_chatbox').contents().find('.chatMod').length) return;
           var memberList = $('#frame_chatbox').contents().find('#chatbox_members li:has(a[href="/u1"])');
           memberList.html(memberList.html().replace(/@/,'<span class="chatMod">@</span>'));
        },1000);
    });
});

Then use this CSS to style the @ :

Code:

.chatMod {
 color:red !important;
 text-shadow:0 0 6px red !important;
}

http://prntscr.com/36ynez, As you can see, it's still white when posting but on the left it's appearing normally :O

Replace your script by :

Code:

$(function() {
    if (document.getElementById('frame_chatbox')) {
      $('#frame_chatbox').before('<iframe id="frame_chatbox" width="100%" height="100%" style="border:none;" src="/chatbox/index.forum">').remove();
    }
    $('#frame_chatbox').load(function() {
        setInterval(function() {
          if ($('#frame_chatbox').contents().find('.chatMod').length) return;
          var user = $('#frame_chatbox').contents().find('#chatbox .user:has(a[href="/u1"]), #chatbox_members li:has(a[href="/u1"])');
          $(user).each(function() {
              $(this).html($(this).html().replace(/@/,'<span class="chatMod">@</span>'));
          });
        },1000);
    });
});

Thank you Ange, Marked as solved

You're welcome

Topic solved and archived