Anyone who has ever used the Genesis framework to develop WordPress child themes understands the power, flexibility and security it provides to website development and maintenance. One true advantage is the ability to easily configure secondary menus or sub-menus on your site, if your child theme supports them. While secondary menus are all well and good, customers often require secondary menus to display only for specific posts or pages. This means developers have to approach sub-navigation menus conditionally. This requires some customization to the child theme. Letâs look at two approaches to solving this problem. They both produce the same results, but one creates a validation error, the other doesnât.
Approach #1
The first approach is the easiest to implement and requires no customization at all. Functionally it works, but it will generate a W3C validation error. If W3C validation is as important to you as it is to me, you should probably jump to Approach #2.
This approach requires the Genesis Simple Menus plugin. This plugin allows you to select different secondary navigation menus for any post or page. Before we get started, make certain you have secondary navigation turn on in the Genesis Theme Settings:
Next, create and save an empty menu. I named the illustrated one "no-menu."
Finally, using the Genesis Simple Menus plugin, select the menu you just created for any page or post upon which you do not want to display the secondary navigation menu.
As I mentioned earlier, this approach works but it produces the following W3C validation error because system still creates the beginning and ending ul elements and there aren't any corresponding li elements for them to wrap around.
Approach #2
Approach #2 is a better option, but it requires inserting a few lines of custom code into your theme's functions.php file. In this example, the code references the page ID for the page upon which you want the secondary navigation menu to appear. The page id is an internal WordPress identifier which is hidden by default. One way to find the page id is to view the All Pages screen and hover your mouse over the name of the page. As you do this, look at your browser's status bar. The url of the page is displayed. The url includes text that reads "post.php?post=xxx" where the xxx is a numerical value representing the page id. This is not an easy way to find the page id, but this is WordPress and there are a lot of talented developers out there writing plugins that expand the platform's functionality. One such plugin is WP Show IDs by Jason of Primo Themes. Install this or any of the other "show id" plugins and your "All Pages" screen will look like this:
Now that you have the page id, copy the following code to the bottom of your theme's function.php file. Change the 8 to the page id of your target page and save the file.
You can use any criteria to drive the "conditions" for displaying the secondary menus. What I've shown you is a very simple example. If you choose to use categories or multiple pages, you'll have more coding to do, but at least now you have a head start for getting there. For example, for multiple pages, change the "if" statement to include an array of page numbers like if ( ! is_page( array( 8, 9, 20, 23 ) ) ). This shows the secondary menu only on the pages listed in the array.
If you would like to see the site where Approach #2 is implemented, please visit Bachman & Associates. Click on the Associates menu item to see the conditional secondary navigation menu. It appears for each of the associate's pages as well.
