Hello,


I was wondering if there is any way i could have one script to change the color of several different user-names, and have each one be a different color.

I know i can change one at a time with a script like this:

Code:

$(document).ready(function(){
$('a:contains("STONERTRAINER420")').replaceWith('
<a href="/u163" style="text-decoration : none;"><span style="color:#ff0000;"><b>STONERTRAINER420</b></span></a>
');
});

Now is there any way i can add more names to it that get replaced or would i need to have a separate script for each name, I was trying to change about 10-15 names and they each where going to be a different color. Any help would be great. Thanks guys.

Hi @Sir. Mayo,

Personally, I'd recommend creating an object that contains your members IDs + the HTML for their custom name. Here's a quick example I wrote up :

Code:

$(function() {
  var users = {
    'u1' : '<span style="color:red">MY</span> <span style="color:blue">NAME</span>',
    'u2' : '<span style="color:purple">ANOTHER</span> <span style="color:pink">NAME</span>'
  },
  a = document.getElementsByTagName('A'), i = 0, j = a.length, k;
 
  for (; i<j; i++) for (k in users) $(a[i]).attr('href') == ('/' + k).toLowerCase() && (a[i].innerHTML = users[k]);
});

You'll see the object at the top of the script named users. Inside it you'll see id:html pairs :

id : The ID of the user you want to modify
html : The html used as the replacement

You can add as much as you want, so long as you separate each pair by a comma.

Thanks. It is solved but could we leave it open for a little in case i have trouble with the code?

Sure, just let me know if you have any questions, or you're completely sure that you wont have any trouble.

Code:

$(function() {
  var users = {
    'u1' : '<span style="color:red">MY</span> <span style="color:blue">NAME</span>',
    'u2' : '<span style="color:purple">ANOTHER</span> <span style="color:pink">NAME</span>'
  },
  a = document.getElementsByTagName('A'), i = 0, j = a.length, k;
 
  for (; i<j; i++) for (k in users) $(a[i]).attr('href') == ('/' + k).toLowerCase() && (a[i].innerHTML = users[k]);
});

@ange tuteur so the code you gave me is not coloring the names on the  forum, or even replacing the names with the colored ones. Is there something wrong with the code. The last one i had changed each name to the color i wanted. any other help would be great.


so it was the 404 error that was not allowing the code to show, once i refreshed and accualty connected it worked! This can be archived now.

Okay, you're welcome ^^

Topic archived

Have a nice day and see you.

Hello,

@Ange Tuteur So the code you provided works great on the forum but when we view a users profile its reverts back to the default color. Maybe i did something wrong?
Here is the edited code that i add my stuff too

Code:

$(function() {
  var users = {
    'u1' : '<span style="color:#00b554" "  text-shadow: 0px 2px 6px #6FB7E3">NightOwl',

    'u2' : '<span style="color:#000000" "text-shadow: 0px 2px 6px #f756b7">エクリプスダルクス</span> ',

    'u5' : '<span style="color:#000000" "  text-shadow: 0px 0px 6px #FFFFFF">Shiny Checkinder</span> ',

    'u9' : '<span style="color:#2eafff" "text-shadow: 0px 2px 6px #6FB7E3">Layre</span> ',

    'u12' : '<span style="color:#e19ef7" "text-shadow: 0px 2px 6px #d3f513"> NintendoDan64</span>',

    'u17' : '<span style="color:#49c7c9" "text-shadow: 0px 2px 6px #6FB7E3">RockManGage </span> ',

    'u20' : '<span style="color:#b649c9" "  text-shadow: 0px 2px 6px #6FB7E3">アシュ</span> ',

    'u21' : '<span style="color:#8246e3" "  text-shadow: 0px 2px 6px #6FB7E3">TheBooman</span> ',

'u42' : '<span style="color:#ff2e2e" "text-shadow: 0px 2px 6px #6FB7E3">Danny.D.Luffy </span> ',

    'u81' : '<span style="color:#0f97d6" "  text-shadow: 0px 2px 6px #FFFFFF">DragonDance2x</span> ',

'u163' : '<span style="color:#40f74f" "  text-shadow: 0px 2px 6px #6FB7E3">STONERTRAINER420</span> ',

'u173' : '<span style="color:#ed9315">Babnelo</span> ',

    'u182' : '<span style="color:##d4c41a" " text-shadow: 0px 2px 6px #FFFFFF">TooCool4u</span> ',

'u186' : '<span style="color:#009aed" "text-shadow: 0px 2px 6px #6FB7E3">Suwako</span> ',

'u204' : '<span style="color:#009aed" "text-shadow: 0px 2px 6px #6FB7E3">masterdoctorten</span> ',
  },
  a = document.getElementsByTagName('A'), i = 0, j = a.length, k;
 
  for (; i<j; i++) for (k in users) $(a[i]).attr('href') == ('/' + k).toLowerCase() && (a[i].innerHTML = users[k]);
});

Any help would be great.

EDIT: It also appears that their avatar is not showing up in the member list now. ?

Do you have it set for all pages?

Yes, sir. Could that be it. We wanted it to change the names on the entire forum.

Well then it needs to be set for all pages.

You have a comma in the last one in your code.

Code:

'u204' : '<span style="color:#009aed" "text-shadow: 0px 2px 6px #6FB7E3">masterdoctorten</span> ',

Thanks for the reply SlGary but i removed the comma and it still does not display the avatars.

The only issue i can think of is that its changing the image in the member list because of the alt tag for the said image. If that makes sense?

Could you let guests see the memberlist?

They are already set up to see the member list.

Is this your forum - http://sir-mayo.forumotion.com/ ?

I do not see a memberlist button.

No sorry i should have said the URL. the forum in question is

http://pokemoncircle.pokemonrpg.org

I believe you are correct that this code is overriding the avatars.

Yes.
When i sign in i see this and when i use a guest account i see the same thing as well:

Change your script to this :

Code:

$(function() {
  var users = {
    'u1' : '<span style="color:#00b554;text-shadow: 0px 2px 6px #6FB7E3">NightOwl',

    'u2' : '<span style="color:#000000;text-shadow: 0px 2px 6px #f756b7">エクリプスダルクス</span> ',

    'u5' : '<span style="color:#000000;text-shadow: 0px 0px 6px #FFFFFF">Shiny Checkinder</span> ',

    'u9' : '<span style="color:#2eafff;text-shadow: 0px 2px 6px #6FB7E3">Layre</span> ',

    'u12' : '<span style="color:#e19ef7;text-shadow: 0px 2px 6px #d3f513"> NintendoDan64</span>',

    'u17' : '<span style="color:#49c7c9;text-shadow: 0px 2px 6px #6FB7E3">RockManGage </span> ',

    'u20' : '<span style="color:#b649c9;text-shadow: 0px 2px 6px #6FB7E3">アシュ</span> ',

    'u21' : '<span style="color:#8246e3;text-shadow: 0px 2px 6px #6FB7E3">TheBooman</span> ',

    'u42' : '<span style="color:#ff2e2e;text-shadow: 0px 2px 6px #6FB7E3">Danny.D.Luffy </span> ',

    'u81' : '<span style="color:#0f97d6;text-shadow: 0px 2px 6px #FFFFFF">DragonDance2x</span> ',

    'u163' : '<span style="color:#40f74f;text-shadow: 0px 2px 6px #6FB7E3">STONERTRAINER420</span> ',

    'u173' : '<span style="color:#ed9315">Babnelo</span> ',

    'u182' : '<span style="color:##d4c41a;text-shadow: 0px 2px 6px #FFFFFF">TooCool4u</span> ',

    'u186' : '<span style="color:#009aed;text-shadow: 0px 2px 6px #6FB7E3">Suwako</span> ',

    'u204' : '<span style="color:#009aed;text-shadow: 0px 2px 6px #6FB7E3">masterdoctorten</span> '
  },
  a = document.getElementsByTagName('A'), i = 0, j = a.length, k;
 
  for (; i<j; i++) for (k in users) if ($(a[i]).attr('href') == ('/' + k).toLowerCase() && !/avatar/.test(a[i].parentNode.className)) a[i].innerHTML = users[k];
});

As for it not working on the profile name. It's only programmed to work with anchor elements ( <A> ), the script iterates over each one and checks if the HREF attribute contains the user's key ( e.g. u1, u2, u3.. ). If it does, it'll replace the innerHTML content with what you specified as that key's value.

In short, if the name isn't an anchor with that user's ID, the custom name wont display.

Thanks. Is there any way i can get them to show up in the profile?

Sure, you could switch the target element to something else, such as <STRONG> or <SPAN>, and compare their textual content to your object's keys. Just change the user IDs, to the user's original username.

Code:

$(function() {
  var users = {
    'u1' : '<span style="color:#00b554;text-shadow: 0px 2px 6px #6FB7E3">NightOwl</span>',

    'u2' : '<span style="color:#000000;text-shadow: 0px 2px 6px #f756b7">エクリプスダルクス</span>',

    'u5' : '<span style="color:#000000;text-shadow: 0px 0px 6px #FFFFFF">Shiny Checkinder</span>',

    'u9' : '<span style="color:#2eafff;text-shadow: 0px 2px 6px #6FB7E3">Layre</span>',

    'u12' : '<span style="color:#e19ef7;text-shadow: 0px 2px 6px #d3f513"> NintendoDan64</span>',

    'u17' : '<span style="color:#49c7c9;text-shadow: 0px 2px 6px #6FB7E3">RockManGage</span> ',

    'u20' : '<span style="color:#b649c9;text-shadow: 0px 2px 6px #6FB7E3">アシュ</span>',

    'u21' : '<span style="color:#8246e3;text-shadow: 0px 2px 6px #6FB7E3">TheBooman</span>',

    'u42' : '<span style="color:#ff2e2e;text-shadow: 0px 2px 6px #6FB7E3">Danny.D.Luffy</span>',

    'u81' : '<span style="color:#0f97d6;text-shadow: 0px 2px 6px #FFFFFF">DragonDance2x</span>',

    'u163' : '<span style="color:#40f74f;text-shadow: 0px 2px 6px #6FB7E3">STONERTRAINER420</span>',

    'u173' : '<span style="color:#ed9315">Babnelo</span>',

    'u182' : '<span style="color:##d4c41a;text-shadow: 0px 2px 6px #FFFFFF">TooCool4u</span>',

    'u186' : '<span style="color:#009aed;text-shadow: 0px 2px 6px #6FB7E3">Suwako</span>',

    'u204' : '<span style="color:#009aed;text-shadow: 0px 2px 6px #6FB7E3">masterdoctorten</span>'
  },
  a = document.getElementsByTagName('STRONG'), i = 0, j = a.length, k;
 
  for (; i<j; i++) {
    for (k in users) {
      if ($(a[i]).text().toLowerCase() == k.toLowerCase()) {
        a[i].innerHTML = users[k];
        break;
      }
    }
  }
});

Also, in the future, make sure that the last pair in an object does not have a comma at the end. Today's browsers usually correct this, but some older browsers will throw an error, therefore halting the execution of other scripts in the same file.

It's a small detail, but it can cause problems if you overlook it.

Thanks Solved Again.

I'll leave this open for now, in case there's anymore problems that you encounter.

Hi

@Ange Tuteur : Is it possible to have this code intact even in chat box? Like the color to remain even when you log in chat box since it disappears once we do?

Regards,
Pizza Boi

@Pizza Boi please remember that when Tagging
Ange Tuteur you must use the following code

Code:

@"Ange Tuteur"

to tag him as the way you have tagged now will not tag the right person.

Much thanks.

APE

as this is marked as solved by the thread starter i will lock it any problems please pm me this link

APE