Style WordPress Sub Page Menus

Wordpress How-To's

Here’s a problem I’ve recently encountered while using the wp_list_pages function for a sub-page menu. The problem was that the “current_page_item” class was cascading to all the sub-page elements.

Here’s what it was looking like:

The particular function I was using was this:

 <?php wp_list_pages('title_li=&child_of=5'); ?> 

And here is what was rendered with that code:

Products 




All you need to do to control the sub-pages is to add a line to your CSS file. All I had to do was the tell it to use white instead of gray for the link color. Here’s the CSS I used:


li.current_page_item ul li a {
color:#FFF; !important;
}

Here’s what it looked like after the CSS fix:

Leave a Reply

Your email address will not be published. Required fields are marked *

What's the Buzz?

In working with Andy, I was extremely impressed by his overall expertise and the “can-do” attitude with which he approached every phase of the project. While some designers may have become frustrated by working with multiple decision makers with limited web development knowledge, Andy was very understanding and strategic in his approach to finding very organized solutions to address our needs. I would highly recommend him!

- Allison Davies
Ten United