I'm currently using a WP-generated list of pages for my site navigation - this is using the method wp_page_menu.

I'd like to add custom styling to specfic list items in the menu, and I was wondering if it's possible to have a function that will assign class names to the list items based on the name of the page they link to.

So, for example, instead of having to apply styles to li.page-item-1500, I'd like to apply styles to the list item generated from the page's title, such as li.about. Is this possible?

(I'm using WP ver 3.3.1, btw)


Yes - you can do this without having to write any code, too.

  • On the 'Menus' page, locate the 'Screen Options' at the top of the page and locate the 'CSS Classes' check box. Click it.

enter image description here

  • After that, expand a menu item and you'll see a new option for 'CSS Classes'

enter image description here

  • Perfect - thanks for that Tom. I just had to change the function from wp_page_menu to wp_nav_menu and I was away.
    – shngrdnr
    Feb 17 '12 at 14:49

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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