How to create a Simple Directory in Wordpress using Grandparent, Parent, and Child Pages
Thursday, June 4th, 2009I wanted to create a simple directory of non-profit organizations. To do so, I wanted to use pages for the directory, rather than posts so that I could separate the static directory listings from the dynamic blog posts. I didn’t want to have to exclude tons of categories from feedburner and the main loop.
So, I started exploring the whole family in Wordpress – grandparents, parents, and children. Translation for those not yet used to seeing Wordpress analagous to the family in My Big Fat Greek Wedding: Pages, sub-pages, and sub-sub pages
Simple Directory Setup
- Directory Page (grandparent): Displays list of Non-Profit Organization Categories (ex. social, environment, health, etc.)
- Category Page (parent): Show title and excerpt of each Organization within a category (ex. Environment Organizations)
- Single Organization Page (child/current): Show content about a single organization(ex. SaveTheEarth – made up org for this example)
Here’s how to do it
- Create a Page Called Directory. This will be the Directory Page (grandparent)
- Find the Page ID. Let’s say the Page ID = 5. Depending on how you want to display the category info, you can
- Manually add the name of each category, a short description and a link
- Open up page.php so we can setup The Category Page (Parent Page). We want to show title and excerpts of each organization for each category.
- Add this code to page.php – Checks if we’re on a sub page / child page of the Directory (Page ID =10) and if so, list the pages in alphabetical order with excerpts. For the excerpt, I’m using the plugin Limit Posts since it didn’t work with The Excerpt Reloaded.<?php
$current = $post->ID;
$parent = $post->post_parent;
$grandparent_get = get_post($parent);
$grandparent = $grandparent_get->post_parent;
?><?php if ( $post->post_parent==”10″ ){ ?>
<?php $pageChildren = $wpdb->get_results(“SELECT * FROM $wpdb->posts WHERE post_parent = “.$post->ID.” AND post_type = ‘page’ ORDER BY post_title ASC”, ‘OBJECT’); ?><h2 class=”titles”><a href=”<? php echo get_permalink($pageChild->ID); ?>”> <? php echo $pageChild->post_title; ?></a></h2>
<?php the_content_limit(280, “”); ?><div class=”readmore”><a href=”<?php echo get_permalink($pageChild->ID); ?>” rel=”bookmark” title=”Permanent Link to <? php echo $pageChild->post_title; ?>”>Read More »</a></div>
(make sure to delete the space between <? and php - I had to to do that so it wouldn’t execute in this post)
- Single Organization Page (Child Page) On page.php, after the code you added in step 5, add this code that will check to see if we’re on the grandchild page. This will be the actual organization’s page. In our example, the SaveTheEarth Page. This is very helpful information in case you want to add a different style or add special items in the sidebar, etc.
<?php if ( $pageChildren ) : foreach ( $pageChildren as $pageChild ) : setup_postdata( $pageChild ); ?>
7. Set up how the rest of the pages on your site will look:
On page.php, after the code in step 6, add this code which instructs every other page in the site to act normally and display the content
<?php endforeach; ?>
<?php else : ?>
<?php the_content(); ?>
<?php endif; ?>
You can see the full page.php code here
You can see the directory in action here
I figured this out using the following helpful posts:
* http://wordpress.org/support/topic/186206
* http://wpguru.co.za/page/display-title-excerpt-of-child-page
![[del.icio.us]](http://images.del.icio.us/static/img/delicious.small.gif){kind=small}
