Is their a way to add a custom class to one link within the main navigation?

For example I would like the category "SALE" to be coloured red and be bold.

Is this possible?

Many Thanks

  • @ToonVanDooren They are all bad solutions, as you'd want a top menu in a CMS to be dynamic. To target nth-child or nav-n is bad practice, as all will fall apart when client adds another menu item. Oct 31, 2016 at 17:35

4 Answers 4


Each menu item has a unique class name nav-1, nav-2, nav-1-1. Use those ones.
Check what nav class your menu item has using firebug.

  • Yes, that makes sense! - I will add CSS to for example: #menu11. Thank you.
    – Davva M
    Nov 9, 2014 at 14:38

Why don't you use the already existing class to select only the main menu,

For example,

.parentMenu a span {
color: red;
font-weight: bold

and for the particular menu, may use nth child selector in css.


Use the mozilla firebug to select the element & identify the css associated with that. Then change the css properties.


using jQuery

jQuery("#nav li.nav-1").addClass( "myClass yourClass" );

change nav-1 to your menu class and make css.

enter image description here

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.