Color Sidebar Menu – Themeco Community

Color Sidebar Menu

envatonetrust — Mon, 01 Sep 2014 08:29:10 +0000

Hi! I want to change the color of the sidebar menu on my website to light blue and also the text color of careers which is present on the sidebar.

This is my site:
http://www.netrust.com.ph/main/

Reply To: Color Sidebar Menu

Christopher — Mon, 01 Sep 2014 08:38:19 +0000

Hi there

Please add this CSS under Custom > CSS in the Customizer.

.x-sidebar #menu-side-menu li a {
  color: #41a6ff;
}

Hope it helps.

Reply To: Color Sidebar Menu

envatonetrust — Mon, 01 Sep 2014 09:29:22 +0000

thanks for the code but it only changes the font color of the text “careers” Is it possible to also change the color of the menu, like the top nav bar menu?

Reply To: Color Sidebar Menu

Christopher — Mon, 01 Sep 2014 09:43:17 +0000

Yes ,You can.
Add this one:

.x-sidebar li a{
color: #41a6ff !important;
}

Thank you.

Reply To: Color Sidebar Menu

envatonetrust — Tue, 02 Sep 2014 02:08:38 +0000

it don’t take effect, it also change the text color. I want to fill the color of the nav side menu not just a transparent one.

Reply To: Color Sidebar Menu

Christian — Tue, 02 Sep 2014 03:27:21 +0000

Hey there,

Sorry for the confusion. Please add background property to your CSS

.x-sidebar #menu-side-menu li a {
color: #000000;
background: skyblue;
}

We can enable transparency by using rgba color value however, your page’s background is white therefore using rgba will be of no use because the background is a solid color. If we use a transparent background, it will mix with the color of your page’s background.

Hope that helps. 🙂

Reply To: Color Sidebar Menu

envatonetrust — Tue, 02 Sep 2014 04:00:59 +0000

Oh! thank you so much for this code, You are such a great help. Can you also include to the change color to blue when my mouse hover on the careers. The default color is black but when i point my mouse on the sidebar text, it changes the color to blue.

Reply To: Color Sidebar Menu

Christian — Tue, 02 Sep 2014 04:32:04 +0000

The code for that would be

.x-sidebar #menu-side-menu li a {
color: blue;
background: orange;
}

For more colors, please see http://www.quackit.com/css/css_color_codes.cfm

Thanks.

Reply To: Color Sidebar Menu

envatonetrust — Tue, 02 Sep 2014 04:53:43 +0000

I apply those codes, but still it does not change the hover over color of “careers” text on the sidebar

Reply To: Color Sidebar Menu

Paul R — Tue, 02 Sep 2014 05:07:44 +0000

Hi,

Sorry for the confusion.

Can you please try the code below.


.x-sidebar #menu-side-menu li a:hover {
    color:#000; /* text color on hover */
    background: red;  /* background color on hover - remove if not needed */
}

Please change the values(#000 & red) with the color you want.

Thank you.