For some rea­son my clients always have weird require­ments for pages. Thank­fully, Word­Press has a way. I remem­ber read­ing a post on a forum recently where a user asked the ques­tion, “I cre­ated a Page and on that Page I want to list all posts in a spec­i­fied cat­e­gory. How do I do this?” Nat­u­rally, one user decided to tell the guy it was impos­si­ble and that he should just stick to the sta­tus quo. This post is more for that doo­fus than it is for the guy who asked.

First, you need to know a few things about the way Word­Press finds all the pretty things it dis­plays. If code makes you wince and or recoil in fear, first, grow up, and sec­ond, use the famous “cut, copy, paste” fea­tures we all know and love.

If you’re over it, we’ll move on…

The goal here is to list all the posts in a spe­cific cat­e­gory on a page which you need to cre­ate. Let’s take a use­ful exam­ple like a port­fo­lio. It could be a port­fo­lio of images or words (or both). The assump­tion here is that you won’t change the text at the top / bot­tom, or that there won’t be any, and that you have such a cat­e­gory with posts in it already. This will make the process easier.

Either use a dev copy of your site, or backup before doing this stuff (or any stuff you read from some ran­dom stranger on the intertubes).

Open your favorite text edi­tor (not Word) and cre­ate a file called portfolio.php (or what­ever you want to call it) and make it look like this.

< ?php
/*
Template Name: Portfolio
*/
?>
<?php get_header(); ?>
<div id="content">

</div>
<?php get_sidebar(); ?>
<?php get_footer(); ?>

Notice that we have all the ele­ments of a good PHP page here, but the thing Word­Press cares about is the “Tem­plate Name: Port­fo­lio” bit. Change this to what­ever you want to call this template.

Next, we have to add a few scripty things to it to make it pull infor­ma­tion from the data­base and dis­play it accord­ing to what we’re after. We’ll need a call to the data­base here. We want to select only posts of a spe­cific cat­e­gory, in this case the port­fo­lio cat­e­gory. For me, the port­fo­lio cat­e­gory is 25, but you can find yours by click­ing the edit link to your desired cat­e­gory in the cat­e­gory man­ager and look­ing at the last num­ber in the URL. The rea­son you want to use the cat­e­gory ID num­ber instead of the name is, on the off chance that you change the name, your new page becomes use­less. The ID won’t ever change.

The ‘showposts=10′ thing is the max­i­mum num­ber of posts I want to appear on the port­fo­lio page. Change that to what­ever num­ber you like, up to and includ­ing sev­eral thou­sand (though I don’t rec­om­mend that). We fol­low up the query with a lit­tle “while” loop so that we can cycle through the results.

<?php query_posts('showposts=10&cat=25'); ?>
<?php while (have_posts()) : the_post(); ?>

At this point, we have a few choices to make. Do we want to dis­play every­thing, or just a few things? As a port­fo­lio, we’d likely want to dis­play an image, be it a thumb­nail or a full sized image. We may want to dis­play text, but we cer­tainly want a link. So, the vari­ables (stuff) we have to work with are as follows:

• the_permalink() — the perma­link to the post in question
• the_title() — the unbe­liev­ably clever title you gave your post
• the_excerpt() — the excerpt that I know you’re using because it’s smart to do
• the_thumbnail() — it’s… well… the pri­mary thumb­nail image
• the_images() — all the images in the post
• the_content() — the body of your post

Since we’re not after con­tent we can skip that, but we may want to make use of the excerpt to entice read­ers to click on the pretty pic­tures. It’s up to you. let’s use the bare min­i­mum for this tuto­r­ial and just go with images and links (and titles for XHTML com­pli­ance). We’re going to style this with divs, and you can make them look how­ever you want by either using exist­ing classes or writ­ing new ones in your style.css file. For now, they’ll be plain and how­ever the browser wants to drop them.

<div> /* This DIV could be a SPAN or nothing depending on how you want it to display  */
<a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title(); ?>"><?php the_thumbnail(); ?></a>
</div>

<?php endwhile; ?>

Putting it all together it should look like this:

<?php
/*
Template Name: Portfolio
*/
?>
<?php get_header(); ?>
<div id="content">
/* If you want to add a heading or text, do it here */
<?php query_posts('showposts=10&cat=25'); ?>
<?php while (have_posts()) : the_post(); ?>

<div>
<a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title(); ?>"><?php the_thumbnail(); ?></a>
</div>

<?php endwhile; ?>
/* If you want text below your gallery, do it here */
</div>

<?php get_sidebar(); ?>
<?php get_footer(); ?>

You can play with it and add more for­mat­ting, add text, or do what­ever you want. After you have it the way you want it, upload it to your active theme’s root direc­tory then add a new page. In the tem­plates box at the bot­tom of the right col­umn, you should see your newly cre­ated tem­plate as an option. You need not add any text to the con­tent block, sim­ply save it as a draft or view it and you should see your port­fo­lio as a clus­ter of click­able thumbnails.

Hit me with ques­tions or com­ments (espe­cially if I typo’d or left some­thing vague).