WordPress as a CMS: showing only child pages of page in menu

I’m working on a CMS for a large site: over 700 pages.

I am using a horizontal menu for the main navigation, but when people are deep in the hierarchy, it makes sense to show them the children of the page they’re on as well as the parents, BUT NOT the other main level pages.

This turns out to require a bit of tinkering. First up I’m using the FlexiPages widget, which comes as close as I can get out of all the PHP code I looked up and the plugins I tried. This shows a bit too much even with the best of settings (it does offer a lot of settings).

I’m letting it:

  • Organize by menu order
  • Show only related subpages
  • Show hierarchy with unlimited depth (Three levels deep I still want the subpages to show)

Using the widget logic plugin I’m showing the widget only on pages, using: is_page()

This gives me almost what I need …I now have a menu on my pages (not my posts) that shows all the top level pages, and the tree the current page is in, as well as any siblings to the current page I’m on, as well as children of the page I’m on.

All good, but I don’t want the top level pages to clutter things up. All else failing, I looked under the hood to see if I could hide the stuff I didn’t need, using CSS. Turns out, FlexiPages gives very granular classes to each level, so I could do that. Here’s the CSS I ended up using:

/* flexipages_widget styling */

.flexipages_widget li a{
display: none;
}
.flexipages_widget li li a, .flexipages_widget li.current_page_parent a, .flexipages_widget li.current_page_ancestor a
, .flexipages_widget li.current_page_item a{
display: block;
}

One thought on “WordPress as a CMS: showing only child pages of page in menu”

Comments are closed.