How to Format Current Menu and Submenu Items Simultaneously with WordPress

October 23, 2012

Yes. I’m now doing a WordPress site. One of the biggest advantages to WordPress is its automatically-generated CSS classes. It automatically generates classes for just about any event, which is really helpful for the developer.

So let’s say you create a submenu in WordPress and you would like to highlight the selected page in the navigation menu as well as its parent page. (Menu creation is another matter, which is also quite manageable.)

You will need to target two classes. The “current_page_item” is whatever page is currently being viewed. The parent page has a class “current-page-ancestor.” In my installation of WordPress, the default stylesheet had underscores (_) instead of dashes(-), so check your FireBug and see which one applies to your menu item.

This solution lets you use pure CSS, rather than needing to combine PHP with jQuery and create your own classes.

Stay in Touch!

Subscribe to our newsletter.

Solutions Architecture

browse through our blog articles

Blog Archive