Put A WordPress Menu In An External Page
December 20th, 2008 | by Conrad Walton |I ran into a situation where I had some old hard coded pages that I needed to drop into a WordPress site. The pages can coexist with Worpress just fine, but getting them to interact was a little harder.
I added the bit of code that would then display the menu.
The next step was to get those 20 hard coded pages to use the same menu that I was using in the WordPress theme. I needed to change the content of that included file.
Here’s how I did it:
I took the index.php file that WordPress uses to do all of it’s magic. I copied that file over to the location of my existing menu.php file, replacing it. My new menu.php file now has the same content as the WordPress index.php file.
<?php
define(‘WP_USE_THEMES’, false);
/** Loads the WordPress Environment and Template */
require(‘./wordpress/wp-blog-header.php’);
?>
<!–start meu–>
<tr>
<td colspan=”6″ align=”left” valign=”middle”>
<div id=”navmenu”>
<ul>
<?php wp_list_pages(‘title_li=&depth=1′); ?>
</ul>
</div>
</td>
</tr>
<!–end menu–>
Where it says to “define(‘WP-USE-THEMES’, true);, changed it to say false. This is where is can get all of the information, the variables, the values that WordPress has to offer, without all of the themes and HTML stuff along with it.
I added the bit of code that would then display the menu. That is between the comments. It adds a <tr>, because this is going into old school table designed pages. This table row will have a div whose ID is “navmenu”.
The actual WordPress tag for the menu will not have a title and it will only display the top level of pages; depth=1. Here’s the WordPress menu tag that I used on the whole site:
When this whole file is included in the static, existing, hard coded PHP file, it will display the existing menu for the whole site. I can add a page or change the name of a page and it will be reflected on these static, hardcoded, pages that are not part of the Worpress theme world.
Pretty cool, huh? Saved me a bucket of work trying to convert all these existing pages into WordPress with a new template for each page.
Here’s the method in work. Look at the “Portfolio” pages on this site:
http://www.flowerart.biz/
I also wanted the highlight to happen on that parent menu item. I couldn’t get the “child_of” to work, since these are not actually pages in WordPress, so I had to look at the “page-item-14″ since that parent page will always have that class. I added this line to my style sheet: .page-item-14 { background-color: #DBE1BB; } It’s not the cleanest way to do it, but it works and I don’t know any other way around it without putting each of those pages into WordPress.
