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?

Andy did a tremendous job in developing a new website for our company from scratch. His vision in developing a “state of the art” website for a furniture retailer was key to making our website one of the top sites in our industry. He was tireless in working to develop new ideas and translate them into a working part of our site.

- Paul Sanford
COO, Roomful Express Furniture