Change text and link color in Forumotion Toolbar

Hello! Don't shoot me for asking this. I already tried CSS to change the color of the text and link inside the "Welcome (USERNAME)" in the toolbar, but I failed. Can someone please help me do that? If it's useful, forum version is Phpbb3. Thank you!

Add this to your css. It changes color of welcome as well as username.

Code:

#fa_welcome {
    color: #ff0000 !important;
}

You can modify the text color and the background with CSS and JavaScript and under ACP -> Modules -> Toolbar -> Configuration, though you will have to pay to modify the copyrights of the toolbar, which is what you're trying to do, I think.

@Sanket: the code didn't work. Here's my CSS:

Code:


#fa_search, #fa_share {
display: none !important;
}
 

#fa_welcome {
    color: #FEF9CF !important;
}


#fa_toolbar, #fa_toolbar_hidden {
  background-color: #000000 !important;
}

#fa_toolbar #fa_right #notif_list li.unread {
font-weight: bold;
background-color: #000000;
}

#fa_menulist, #fa_usermenu {
    background-color: #000000 !important;
}


Please tell me if there's something wrong in what I did. Thanks a lot!

@Ultron's: Thanks to your reply. Yes, I used that to change the color of the toolbar itself, but what I need is the text inside the "Welcome". I've seen a handful of site that has edited the colors of the toolbar and text inside it. Correct me if I'm wrong but the only thing that was not allowed is to remove the copyright.

Whats your forum URL?

You added this code already.

Code:

#fa_welcome {
    color: #FEF9CF !important;
}

http://isolationrpg.topicboards.com/

Thanks a lot!

edit: the code just changed the "Welcome" message, not the contents when clicked.

Try using this additionally to the code Sanket provided:

Code:

#fa_welcome * {
color: #fef9cf !important;
}

Thanks Ultron. Still doesn't work.

Hi,

Remove the codes given above and try this:

Code:

#fa_right #fa_menu #fa_welcome, #fa_right.notification #fa_menu #fa_welcome {
color: #FFFFFF !important;
}

T___T Sorry, Sir Chivas, the code still doesn't work.

Here's my CSS, hope this helps:

Code:


#fa_search, #fa_share {
display: none !important;
}
 

#fa_right #fa_menu #fa_welcome, #fa_right.notification #fa_menu #fa_welcome {
color: #FFFFFF !important;
}



#fa_toolbar, #fa_toolbar_hidden {
  background-color: #000000 !important;
}

#fa_toolbar #fa_right #notif_list li.unread {
font-weight: bold;
background-color: #000000;
}

#fa_menulist, #fa_usermenu {
    background-color: #000000 !important;
}


Edit: I also tried #fa_menulist { color: #FFFFFF !important} and #fa_menulist:link {color: #FFFFFF !important}, hoping that i get it, but i fail. I just said it thinking it might help...

Can you provide a screenshot of how you have the setting through the ACP? ACP >> Modules >> Toolbar >> Configuration

Oh, it turns white when clicking?

Try this:

Code:

#fa_right.welcome #fa_menu #fa_welcome {
color: #fff;
background-color: #000;
}

it doesn't turn white anymore, but the text inside is the drop-down doesn't change its color.

Try using this in your CSS:

Code:

ul#fa_menulist li {
color: #fef9cf !important;
}

^ the color still doesn't change.

Hm, try it with this code...

Code:

ul#fa_menulist li a {
color: #FEF9CF;
}

I excluded the !important and added a more explicit selector.

:eek: nope, still not working. Please check my CSS to see if i did anything wrong:

Code:


#fa_search, #fa_share {
display: none !important;
}
     
#fa_right.welcome #fa_menu #fa_welcome {
color: #fff;
background-color: #000;
}

ul#fa_menulist li a {
color: #FEF9CF;
}

#fa_toolbar, #fa_toolbar_hidden {
  background-color: #000000 !important;
}

#fa_toolbar #fa_right #notif_list li.unread {
font-weight: bold;
background-color: #000000;
}

#fa_menulist, #fa_usermenu {
    background-color: #000000 !important;


Add this on your CSS:

Code:

#fa_menu, #fa_welcome {
background-color: black !important;
color: white !important;
}
#fa_usermenu {
color: white !important;
}

^ do i need to remove anything from my current CSS, posted in my previous post?

Edit: nvm. i figured. the code worked for the fa_rank and the PM and post, thank you very much. But the links on the other side didn't change its color. I do want to change their colors.

Yeah try removing the other codes then check.

Add this again on your CSS:

Code:

#fa_menulist a:link, #fa_menulist a:visited {
color: red !important;
}

Change the red to your desire color .

Aaaaaaaaaaand, finally! You're the man, E-Mark. Thanks a lot!

(And thank you too, Sanket, Ultron and Sir Chivas)