Jump to content

Changing Button Colors

Featured Replies

Posted

How do I change the color for the top right hand corner buttons. So the bell sign in mail and create button colors?

  • Author

Bump...

Let me clarify. How do you change the color of the buttons in the top right hand corner? So basically the Create, Bell, Mail, and sign in buttons?

#elUserNav > li > a {
    color: #fff;
    font-size: 13px;
    line-height: 1;
    vertical-align: middle;
}
  • Author
On 1/22/2016 at 8:51 PM, broni said:
#elUserNav > li > a {
    color: #fff;
    font-size: 13px;
    line-height: 1;
    vertical-align: middle;
}

Where do I put this? I am new.

12 minutes ago, Merlin Starfinder said:

Where do I put this? I am new.

Go to AdminCP -> Customization -> Themes -> {YourTheme} and click the <> edit code link.

Search for "elUserNav" and toggle from Templates to CSS. The file you are looking for should be CSS -> Core -> Framework -> global.css and you'll see various entries. Scroll down global.css until you find the /* USER NAVIGATION */ section, and look for #elUserNav > li > a. You can change the color here....

	#elUserNav > li > a {
		color: #fff; */THIS IS THE VALUE THAT CHANGES COLOR */
		font-size: 13px;
		vertical-align: middle;
		line-height: 1;
	}

I suggest using a browser like Chrome. Right click over the buttons you want to change colors for, and select Inspect Element. You can play around with various values and see live results of the changes. Just know that none of these changes are ever saved. You have to actually edit the template files inside the AdminCP.

Hope this helps!

..or better yet put this in "custom.css" file:

#elUserNav > li > a {
    color: your_new_color;
}

Thank you. I was unaware of the custom.css file until yesterday. That's gonna be a time saver when templates get upgraded :D

Archived

This topic is now archived and is closed to further replies.

Recently Browsing 0

  • No registered users viewing this page.