Secrets of WP Theming: Part 1

Tagged | 2 Comments | 0% of Visits & Shares this week.

Today I am beginning a series on some of the lesser known features of the Theme System in WordPress 1.5 , I am not sure how many parts there will be, might be just this one.  But don't count on it.  Here are Part 2 and Part 3.

So lets talk about Custom Templates, and more importantly how we can bend them to our will.  Now I am assuming that by now everyone has at least a passing familiarity with Templates in WP 1.5, for those who are not up-to-speed, lets cover some back-story.

In the beginning were Templates, and lo they were good.

Templates are the foundation of the WP theme system, and one of the most powerful features, in my opinion, in 1.5.  A template defines the layout and "feel" of different aspects of your WP powered site.

There are a number of templates that are strictly defined in WP, they are as follows (list taken from the codex):

  1. style.css
  2. index.php
  3. comments.php
  4. comments-popup.php
  5. home.php
  6. single.php
  7. page.php
  8. category.php
  9. author.php
  10. date.php
  11. archive.php
  12. search.php
  13. 404.php

For instance, I have a template that defines the look of my index, one that defines viewing single posts and one for category listings.  Each one has different structure, CSS and WP function calls based on its purpose.  The one thing they all have in common is the_loop, or the bit of code that tells WP to spit out the appropriate posts for a specific area of my site.

So class, are we all caught up on templates?  Good, well what happens when we want to add a page to our site that doesn't have anything to do with our posts or categories?

Say we want to add an archives page like the one here at Sillyness to our sites?

Again we turn to Templates, more specifically Custom Templates.

Templates, Posts, Pages and Plugins

Now we have already stated that there are a number of strictly defined templates in WP.  But there is also another category of templates, ones that can be anything, can be called anything and can be applied to any "Page" you create in WP.  It is here with Custom Templates that the fun begins.

It is a little known fact that you can apply custom templates to blank "Pages" in WP.  What I mean is that you can create a completely blank page in WordPress and then apply a custom theme laden with code to it.  As an example lets look at the archives page here at Sillyness.

If you were to look at the page I created in WP named Silly Archives, the "Page Content" area would be completely blank.  If you then opened my custom template you would see a whole mess o' code, and interestingly enough the_loop is no where to be found.  In fact the only WP core code that you would find would be get_header(); and get_footer();

The rest is either embedded code, or plugin calls.

So let's get into some code.

So back to our hypothetical example.  Our first step would be to create the custom template that will be applied to our Archives page.  Because we do not re-invent the wheel, we will be making use of Shawn Grimes Clean Archives plugin, and my Commenter Heat Map plugin.

So first things first, every custom template must start with the following code:

<?php 
/*
Template Name: Archives Template
Description: A template for my archives pages.
*/
?>

In addition for this particular page we need to add a call to wp-blog-header.php so our opening code will actually look like this:

<?php
require('./wp-blog-header.php');
/*
Template Name: Archives Template
Description: A template for my archives pages.
*/
?>


Next we call for our header.php file and start adding our content:

<?php get_header(); ?>
<div class="main">
<h2>
Here are the archives for <?php bloginfo('name'); ?>.
</h2>

<p>
Search the archives.
</p>

<div class="search">
<form method="get" id="searchform" action="/index.php">

<input type="search" value="Search" name="search" id="s" />
<input type="submit" id="submit" name="Submit" value="Go!" />
</form>

</div>

Now you could have put some of this in the "Page Content" area of the 'Create Page' screen, but for this demo we want to have everything in the template, so on we go.

<?php echo srg_clean_archives(); ?>

<h2>
Commenter Heat Map
</h2>

<p>
Below is a heat map of the commenters here.
</p>

<?php cjd_comment_heat(); ?>

</div>

And finally we close with the footer call:

<?php get_footer(); ?>

And that is the entire template, now we save it as new_archive.php and upload it to our /wp-content/themes/ourtheme/ folder, then log into our WP admin area to create a new Page.

Lastly we need to create a blank Page and link it up with our new template.

So let's go to Write > Write Page and get to business.  First off we need to give our page a title, let's say My Archives, once that is done we can skip down past the "Page Content" area to "Page Options".

The first field should be Page Template, and in the drop down box we should find Archives Template, select that and click Create New Page.  That's it, if you have installed and activated the plugins, when you load http://my.site/my-archives/ you should see your lovely new Archives page.

Well that's it for the first of this series.  I hope you have had as much fun as I have.  If you have any questions, leave them here in the comments and I will do my best to answer them.