WordPress CMS: Sane Menus

Over the past couple days i’ve moved my entire portfolio from static HTML pages to wordpress pages. for the moment i’m using one template for all of them. With static HTML I was using 1 template per project, which let me show only the current project’s pages in the side menu, and the list of projects in the top menu. (example). With Using 1 template, it’s tempting to use <?php wp_list_pages() ?> to generate the side menu. except that i have A LOT of pages. 38 at last count. So I want the side menu to only show the list of projects, and the list of subpages for the current project.

While I could do something like hiding .pagelist ul ul ul in CSS, and then making .pagelist ul li.current_page_item visible, the nexted lists under .current_page_item always looked kind of stupid, since there’s no way to style them individually. So I looked to squible. because I remembered karrde dealing with a submenu that showed other children of the current page’s parent. so now my menu looks like this:

<div class="floatmenu">
<h2 id="page-title"">Mapping</h2>
<ul class="pagelist">
<?php wp_list_pages('exclude=164,202&sort_column=menu_order&depth=2&title_li='); ?>
<h2 id="page-title"">Contents</h2>
<ul class="pagelist"><li><ul>
<?php /* karrde is a GOD. this comes from squible */
$kids = get_pages('child_of='. $post->ID);
if (count($kids) > 0) {
wp_list_pages('depth=1&sort_column=menu_order&title_li=&child_of='. $post->ID);
} else {
if ($post->post_parent != 0) {
wp_list_pages('depth=1&sort_column=menu_order&title_li=&child_of='. $post->post_parent);
</div><!-- floatmenu -->

Now we get two menus, one of which shows projects and graphics, and their subpages (sortdepth=2 hides the subpages of the projects). The second menu shows only the children the current page, or the children of current page’s parent. Works great for pages inside a project (example), or project pages (example). But when you’re looking at Projects or Graphics, you get the same sub pages listed twice. Fixing that also fixed the styling issues with having a nested list in .current_page_item:

.pagelist .current_page_item li {
display: none;

HA! I love it. This won’t work for every CMS use of wordpress. It works for me because i have relatively few 1st and 2nd level pages, and a whooooole lot of 3rd level pages.

Bookmark This:

add to del.icio.us :: Digg it :: add to ma.gnolia :: Stumble It! :: seed the vine :: TailRank


2 thoughts on “WordPress CMS: Sane Menus

  1. Pingback: Converting a HTML Site To WordPress » The Affiliate Marketing Blog

  2. Daniel

    Freak’n awesome post. This is exactly what I was looking for to take care of a two level sub nav problem. Cheers!

Comments are closed.