Docs

[Bark201]

I read in the forum that by adding i class to the nav item and icon would appear. I tried that based on what I read in the forum and its not working. I noticed that after saving it wordpress removed the < >.

I am trying to add a lock icon to one of the nav items. If you can please provide the css to get it to work that will be great as I may be doing something wrong. Also, I want to customize the size of the icon and its color, please let me know how to get this done.

Thanks.

[Bark201]

Forget the icon, I just want to change the color of the menu item and the hover color just for that. I am not sure how to do it in CSS (I know its easy but my CSS knowledge is limited).

The nav menu item id is 27709.

[Bark201]

I know its something like that but how do I change the hover color as well?

#menu-item-27709 a{
color: #00EE00 !important;
}

[Joao]

Hi There,

Please add the following code

#menu-item-27709 a:hover {
color: #00EE00;
}

Hope it helps

Joao

[Bark201]

Thanks but how do I set the color first and then the hover color?

[Darshana]

Hi there,

To set a color first, add the following CSS rule.

#menu-item-27709 a {
color: #336699;
}

Hope that helps.

[Bark201]

Im so dumb sometimes, thank you.

[Prasant Rai]

You are most welcome. Feel free to ask us again. Have a great day! 🙂

[Bark201]

Ok, I changed my mind, I will need a lock icon on that menu item. What Im trying to do is have the lock’s color the same as the menu item and then when its hovered on to change with them item menu color. I already have the CSS for the menu item, I just need to add a lock icon next to it with the same CSS.

The unicode for the lock is &XX#xf023; (remove the XX)` if needed. Please help.

DO NOT TAKE ANY SCREENSHOTS OF MY SITE AND POST IT IN PUBLIC, ONLY PRIVATE.

[Christopher]

Hi there,

Please add <i class="x-icon-lock" data-x-icon=""></i> in menu item label field.
To add or change icons, check this link https://theme.co/changelog/#theme-4-0-0

Hope it helps.

[Bark201]

Thank you, that did it. Last thing on the nav menu item, how do I control the font weight of that specific menu item?

[Thai]

Hi There,

Please update the CSS to this:

#menu-item-27709 a {
	color: #336699;
	font-weight: 600;
}

Hope it helps 🙂

[Bark201]

Thank you. I tried that and it didnt seem to work. Any ideas?

[Nabeel A]

Hi again,

Can you please provide the URL of your site so we can take a closer look?

Thanks!

[Author]

Posts