WordPress CMS Quest: How to Put Child Page Excerpts on a Parent Page

Showing excerpts from Child Pages on a Parent Page would seem to be incredibly useful for all sorts of users, not the least of which are businesses trying to use WordPress for their entire company websites (i.e. not just for blogging).

Although Pages don’t have excerpts out of the box, adding a plugin and configuring a few things will let you show excerpts from Child Pages on a Parent Page.

Three Steps

Essentially, there are three things that need to be done.

1. Install a Page Excerpts plugin.
2. Create a customized page template to show the excerpts on the Parent Page.
3. Assign your template to your Parent Page.

 

Tutorial: Hypothetical Web Design Company

In order to run through this process, we’ll pretend we’re a simple web design company that wants to have a main “Web Packages” parent page, and then child pages for each type of design package it offers (Standard, Pro, & Premium).

Now, granted, if you were a web design company, you’d probably want better graphics than this, but this is just a simple example stripped down to the bone.

Let’s go ahead and take a look at the finished page to see what we’re trying to do.

 

Page Excerpts Plugin

Out of the box, WordPress doesn’t provide excerpts for Pages, and so the first thing you’ll need to do is install a page excerpts plugin. It seems there are a few of them out there. The first one I tried worked, and so I went with that. (As this isn’t a plugin post, I didn’t try the others. As long as it works, you’re good to go.)

 

Create a Custom Page Template

You will need to create a new template for you Parent Page. In order to do this, follow the instructions below:

Step I: Create a New Template File

On your server, find your theme’s folder (wp-content/themes/your-theme).

Create a new file and name it something unique and appropriate (e.g. page-excerpt.php). Remember to end it with the .php extension.

After that, find the file named page.php. Open that, copy the contents, and then go back to the file you just created (page-excerpt.php), and paste those contents into your new file.

Now, at the VERY TOP of your new file (i.e. BEFORE the content you just added into it), put the following:

 

<?php
 /*
 Template Name: Page Excerpt
 */
 ?>

 

It should look something like this:

 

Step II: Insert Code to Pull in the Excerpts

This part might get a little tricky depending on your theme.

Essentially,  you want to insert the following code after your loop (the code that displays your content):

<?php
$pageChildren = get_pages('sort_column=menu_order&hierarchical=0&child_of='.$post->ID);
if ( $pageChildren ) {
foreach ( $pageChildren as $pageChild ) {
echo '<p><a href="' . get_permalink($pageChild->ID) . '">'. $pageChild->post_title.'</a></p>';
if (!empty($pageChild->post_excerpt)){
echo '<p>' . $pageChild->post_excerpt.'</p> ';
}
}
}
?>
Possible Problems

When I did this with WordPress’ Twenty Ten theme, however, it didn’t work. And so it might not work with your theme either.

The solution was to remove the code that the Twenty Ten theme was using to pull in the content for the page and replace that with a different piece of code for the loop. (Or, if you want ONLY excerpts on the page, you could substitute the code above for the loop code.)

If you run into problems, try this …

Search for your “content div.” It will probably look like this (although it may have a few other properties to it as well).

<div id="content">

And then go down and search for the spot where that div closes off. It may just say </div> or it may say something like …

</div><!-- #content -->

Delete everything in between the opening div and the closing div. And then replace it with this …

<?php if (have_posts()) : while (have_posts()) : the_post(); ?>
<h1><?php the_title(); ?></h1>
<?php the_content(__('Read more'));?>
<?php endwhile; else: ?>
<?php endif; ?>
<?php
$pageChildren = get_pages('sort_column=menu_order&hierarchical=0&child_of='.$post->ID);
if ( $pageChildren ) {
foreach ( $pageChildren as $pageChild ) {
echo '<p><a href="' . get_permalink($pageChild->ID) . '">'. $pageChild->post_title.'</a></p>';
if (!empty($pageChild->post_excerpt)){
echo '<p>' . $pageChild->post_excerpt.'</p> ';
}
}
}
?>

It should look something like this …

Save your file, and you’re done with the template.

 

Creating Your Parent Page

When you create your Parent page (in this case “Web Packages”), you should now see an option on the right-hand side to select your new template: Page Excerpt.

If you choose to write anything on this page, what you write will appear on top of the excerpts for the child pages. Because of this, you might even consider putting a headline for the child excerpts that will come after. To do this, put your headline at the BOTTOM of this parent page.

Creating Child Pages

In order to create a child page, you simply select the parent page on the right-hand side of the edit screen. You also have the ability to control the order of your child pages there.

As mentioned above, you can control the order of your child pages on the edit screen. But you can also control the order through the Quick Edit function by going to Pages > All Pages > (hover over title) Quick Edit.

The order of your pages will determine the order of your excerpts. By default, all pages are set to “0” for the order. And so if you set another page to “1,” the “0” page will still show up before it because its number is still lower.

Creating the Excerpt

The excerpt plugin doesn’t automatically take excerpts from your Pages, but it does give you an Excerpts Box on your editing screen that you can then fill in.

Once uploaded and activated, when you are on the editing screen for your Page, you may have to activate the Excerpts Box through your “Screen Options” at the top of the page in the right-hand corner.

Once that is done, you should see an Excerpts Box under your main writing screen where you can manually insert excerpts.

 

The Finished Product

Let’s take one more look at the finished product, this time with a few notes:

 

 

WordPress as a CMS

For some, this solution might be a big step toward making WordPress truly work as more a fully-fledged CMS. I can’t tell you how many times I’ve heard people say they’ve built WordPress sites without ever using one single “Post” page.

If you use Pages extensively, then sooner or later you are bound to run across situations where using Child Pages, and then their excerpts, of course, would be a logical fit for your needs. While it would be nice to have all this functionality built in, this solution should work for you in the meantime.

 

 

Photo: CMS : content management system concept. Isolated on white from BigStock

Tags:

• cms
• pages