Let's say you're writing a book where you publish each chapter as it is finished. You're going to use WordPress pages for your content organization, with a top-level page describing the book and then a subpage for each of the chapters in your book.
On the top-level page, in addition to the book title and description, you want to display links to each of the chapters, and a brief description of their content. This task would be difficult with a lot of other content management systems, but not with WordPress.
Getting ready
To properly use the techniques in this recipe, you'll need to be working with a theme that you previously acquired or developed. If you haven't started developing a custom theme yet, I recommend using the Thematic theme. It can be freely downloaded from the WordPress.org Theme Repository, at http://wordpress.org/extend/themes/thematic/.
How to do it...
First, follow the steps in the recipe Creating a simple page template until you reach the point at which you start adding custom content. While following that recipe, modify the filename from hello-world-page-template.php to toc-page-template.php and change the value of the Template Name: header from Hello World to Table of Contents. Now you need to create the appropriate content that will be displayed when using this page template. Create a top-level page for your book with the work's title as the post title, and choose the Table of Contents template from the Template drop-down menu in the Attributes meta box.
Then create several child pages, using the chapter's title as the post title. For each child page, make sure that you choose your main book page from the Parent dropdown and the Table of Contents option from the Template dropdown. When you're done, visit the Edit Pages interface, and you should see something like the example shown in the following screenshot:
Chapter order
When you're creating your book's chapters, make sure that you set the Order property in the Attributes meta box (the same place that you change the page template) to the number of the chapter. This ensures that your chapters appear in the correct order.
Now you're ready to write the code to generate your table of contents. After the comment header, add the following markup to your page template, and then save the file:
<?php get_header(); ?>
<h2 class="book-title"><?php the_title(); ?></h2>
<div class="book-description">
<?php the_content(); ?>
</div>
<h2>Chapters</h2>
<ol>
<?php
$chapters_query = new WP_Query(array(
'post_type'=>'page',
'post_parent'=>get_the_ID(), 'orderby'=>'menu_order', 'order'=>'ASC'
));
if($chapters_query->have_posts()) { while($chapters_query->have_posts()) { $chapters_query->the_post();
} } ?>
</ol>
<?php }
} ?>
</div>
</div>
<?php get_sidebar(); ?>
<?php get_footer(); ?>
When this page template is used, the book's title will be displayed as the main heading and will be followed by an ordered list of chapter titles and excerpts. If you've added your content correctly, and selected the Table of Contents page template for your main book page, you should be seeing something similar to the example shown in the following screenshot:
You'll see here that you have your book title at the very top of the page, followed by the full content of your book's description. After that, you have a link to each chapter, along with the chapter title and an excerpt.
How it works...
By this point you should have a pretty good idea of the way that custom page templates work.
If you need a refresher, see the How it works... section of the Creating a simple page template recipe. In addition, you'll notice that we've used a custom Loop in this page template. For more on custom and multiple Loop constructs, see the recipe Creating multiple loops on a single page in Chapter 3, The Loop.
There aren't too many new and novel things in this recipe, but there is one particular item to note. Check out the get_the_ID function usage in the recipe code. Rather than hard-coding a parent ID to fetch the book's chapters, you're dynamically applying the ID from the
currently-viewed page. This means that you can reuse the Table of Contents page template for multiple books on a single site.
There's more...
You've created a page template that links to each of the chapters in a book and this should prove quite useful to your site's visitors. However, wouldn't it be great if your chapters showed your visitor's progress through the book that they're reading? It's easy with another custom page template. Create a new file called chapter-page-template.php, insert and then save the following code, and then assign to each chapter the Chapter page template:
<?php get_header(); ?>
<h2 class="chapter-title"><?php the_title(); ?></h2>
<ol class="table-of-contents">
<?php
$chapters_query = new WP_Query(array(
'post_type'=>'page',
'post_parent'=>$current_chapter->post_parent, 'orderby'=>'menu_order',
));
if($chapters_query->have_posts()) { while($chapters_query->have_posts()) { $chapters_query->the_post();
setup_postdata($current_chapter);
?>
</ol>
<div class="chapter-contents">
<?php the_content(); ?>
With this template, you're generating a list of all chapters that are using the currently-viewed chapter's post_parent property. You're also highlighting the current chapter by checking the currently-viewed chapter's ID against the ID of each chapter in the list generation Loop. If you've done everything correctly, you'll be greeted with a short Table of Contents at the top of every chapter page, with the current chapter in bold. It should look like the example shown in the following screenshot:
See also
Creating a simple page template Creating multiple loops on a single page