Assign title-specific class to list items in menu based on WP pages

by

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)

1 Answer
1

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

Leave a Comment