Advertisement

Create A WordPress Archives Template for Your Theme

by

This Cyber Monday Tuts+ courses will be reduced to just $3 (usually $15). Don't miss out.

An archives page is great way of linking to all of your important archives such as monthly archives and category archives on one dedicated page. It's a great alternative to simply linking to your older posts in your sidebar and footer. Surprisingly, a lot of themes out there don't include one by default... so today, we're going to show you a quick way of building one from scratch.

The Kubrick WordPress Theme, which was the default theme of WordPress for 5 years (version 1.5 until 3.0), came packaged with its own archives.php template. Sadly, the last two default WordPress themes (TwentyTen and TwentyEleven) have not.

As most WordPress themes do not come with an Archives template, it is frequently necessary to create your own. In this tutorial we will be walking you through how you can create a simple archives page using the current default theme TwentyEleven however these steps can be applied to any WordPress design.


Before We Start

Please do not confuse the archive.php template and the archives.php template. The archive.php template is included in most themes and is used to generate monthly archives, category archives, author pages etc (the parent file index.php is used if no archive.php template is available). For example, archives like www.yoursite.com/2011/12/ and www.yoursite.com/category/main-category/.

What we are creating today is the archives.php template. This helps create a dedicated Archive page on your website that lists to all of your monthly archives. For example, www.yoursite.com/archives/.


Step 1 Copy Your Page.php Template

The best way to create any new WordPress page template is by copying the code from the themes page.php template and removing the code within the main content area. The Twenty Eleven page.php template looks like this:

<?php<br />
/**<br />
 * The template for displaying all pages.<br />
 *<br />
 * This is the template that displays all pages by default.<br />
 * Please note that this is the WordPress construct of pages<br />
 * and that other 'pages' on your WordPress site will use a<br />
 * different template.<br />
 *<br />
 * @package WordPress<br />
 * @subpackage Twenty_Eleven<br />
 * @since Twenty Eleven 1.0<br />
 */<br />
<br />
get_header(); ?><br />
<br />
		<div id="primary"><br />
			<div id="content" role="main"><br />
<br />
				<?php while ( have_posts() ) : the_post(); ?><br />
<br />
					<?php get_template_part( 'content', 'page' ); ?><br />
<br />
					<?php comments_template( '', true ); ?><br />
<br />
				<?php endwhile; // end of the loop. ?><br />
<br />
			</div><!-- #content --><br />
		</div><!-- #primary --><br />
<br />
<?php get_footer(); ?>

Step 2 Create An Empty Archives.php Template

Copy your page.php template code to a new template file called archives.php. We will now remove the code that we do not need for our archives template.

The main content area of the Twenty Eleven page.php template simply displays the loop. All you need to do is remove those 4 lines of code. (i.e. remove the while statement).

Additionally, you should add the following:

  • Template Name: Archives Template - Add this to the top of your template to make it selectable as a page template in your page editor.
  • <?php the_title(); ?> - This will display our archives page title.
  • <?php the_post(); the_content();  ?> - This will ensure any content that is added to your Archives Page via the WordPress page area will be displayed at the top of the page (You do not need to add this line if you do not plan on writing an introduction before your archives).

This gives us the following:

<code>
<?php<br />
/**<br />
 * Template Name: Archives Template<br />
 * Description: A Page Template that lets us created a dedicated Archives page<br />
 *<br />
 * @package WordPress<br />
 * @subpackage Twenty_Eleven<br />
 * @since Twenty Eleven 1.0<br />
 */<br />
<br />
get_header(); ?><br />
<br />
		<div id="primary"><br />
			<div id="content" role="main"><br />
                          <br />
		          <h1 class="entry-title"><?php the_title(); ?></h1><br />
                          <?php the_post(); the_content();  ?><br />
<br />
                          <!-- The main functions of our Archives.php template will go below here --><br />
<br />
<br />
                          <!-- The main functions of our Archives.php template will go above here --><br />
<br />
			</div><!-- #content --><br />
		</div><!-- #primary --><br />
<br />
<?php get_footer(); ?>
</code>

You now have an empty archives template. It's time to populate it with some content :)


Step 3 Call Some Basic Functions In Your Archives.php Template

Most archives pages display a search form, monthly archives and category archives. These can be added to your archives.php template using the following 3 functions:

  • get_search_form();
  • wp_get_archives();
  • wp_list_categories();

Your archives.php template should now look something like this:

<?php<br />
/**<br />
 * Template Name: Archives Template<br />
 * Description: A Page Template that lets us created a dedicated Archives page<br />
 *<br />
 * @package WordPress<br />
 * @subpackage Twenty_Eleven<br />
 * @since Twenty Eleven 1.0<br />
 */<br />
<br />
get_header(); ?><br />
<br />
		<div id="primary"><br />
			<div id="content" role="main"><br />
                          <br />
		          <h1 class="entry-title"><?php the_title(); ?></h1><br />
                          <?php the_post(); the_content();  ?><br />
<br />
                          <!-- The main functions of our Archives.php template will go below here --><br />
<br />
                            <?php get_search_form(); ?><br />
		<br />
		            <h2>Archives by Month:</h2><br />
		            <ul><br />
			     <?php wp_get_archives(); ?><br />
		             </ul><br />
		<br />
			    <h2>Archives by Subject:</h2><br />
			    <ul><br />
			      <?php wp_list_categories(); ?><br />
		            </ul><br />
<br />
                          <!-- The main functions of our Archives.php template will go above here --><br />
<br />
			</div><!-- #content --><br />
		</div><!-- #primary --><br />
<br />
<?php get_footer(); ?>

Step 4 Create An Archives Page

Your theme now has a basic archives.php template. The next thing you need to do is create a new page on your website (i.e. at http://www.yoursite.com/wp-admin/post-new.php?post_type=page). You can call the page anything you want e.g. Archives, Site Archives, Sitemap etc.

Make sure you change the template for the page from the default template to your newly created archives template.

If you followed this tutorial using the Twenty Eleven theme, your archives page should look something like this:


Bonus Step Customising Your Archives Page

In step 3 we added a search form, monthly archives and category archives to our archives page. The wp_get_archives and wp_list_categories functions that we used are very versatile and can be used to display a wide range of different archive lists.

Two other functions that you may find useful are wp_list_pages and wp_tag_cloud.

Below you will find some examples of the parameters that can be passed to all of these functions. You should find them useful in customising your archives.php template further.

wp_get_archives Examples

<?php wp_get_archives('type=daily&limit=30'); ?>

Displays the last 30 days of posts.

<?php wp_get_archives('type=postbypost&limit=20'); ?>

Displays the last 20 posts.

<?php wp_get_archives('type=weekly'); ?>

Displays weekly archives.

<?php wp_get_archives('type=weekly&limit=12'); ?>

Displays 12 weekly archives.

Note, this doesn't necessarily list the last 12 weeks of posts. If will list the last 12 weeks that there were posts published i.e. the list could go back years if your blog hasn't been updated much.

<?php wp_get_archives('show_post_count=1'); ?>

Displays monthly archives with post counts.

<?php wp_get_archives('type=yearly'); ?>

Displays yearly archives.

<?php wp_get_archives('type=alpha'); ?>

Displays all posts alphabetically.

<?php wp_get_archives('type=postbypost'); ?>

Displays all posts by date. Newest posts are listed first.

wp_list_categories Examples

<?php wp_get_archives('show_post_count=1'); ?>

Show post count of categories.

<?php wp_list_categories('title_li=Info'); ?>

Change the name of the list title from 'Categories' to 'Info'.

<?php wp_list_categories('hide_empty=0'); ?>

Display empty categories in the category list.

<?php wp_list_categories('include=1,5'); ?>

Only list categories 1 and 5.

<?php wp_list_categories('exclude=2'); ?>

Do not list category 2.

<?php wp_list_categories('depth=1'); ?>

Show only top level categories.

<?php wp_list_categories('depth=3'); ?>

Show three level of categories (i.e. top category, child category and child of child category).

<?php wp_list_categories('child_of=3'); ?>

Only show the children categories of category 3

<?php wp_list_categories('title_li=News&include=4show_post_count=1'); ?>

Only show category 4, show post counts and change the list title from 'Categories' to 'News'.

wp_get_archives Examples

<?php wp_list_pages(); ?>

List all pages and sub pages.

<?php wp_list_pages('title_li='); ?>

Display all pages and sub pages but no list title.

<?php wp_list_pages('sort_column=post_date'); ?>

Sort pages by the date they were created.

<?php wp_list_pages('sort_column=post_modified'); ?>

Sort pages by the date they were last modified.

<?php wp_list_pages('include=2,4,6' ); ?>

Only list the pages that you specify.

<?php wp_list_pages('exclude=1,9' ); ?>

Exclude certain pages from the list.

<?php wp_list_pages('depth=1' ); ?>

Only display the top level of pages.

<?php wp_list_pages('depth=2' ); ?>

Display pages and the first level of sub pages.

wp_tag_cloud Examples

<?php wp_tag_cloud(); ?>

Display your tag cloud in full.

<?php wp_tag_cloud('orderby=count'); ?>

Order your tag cloud by count (least number of topics to most).

<?php wp_tag_cloud('smallest=15&largest=30'); ?>

Set the text sizes for smallest and larger count values (8 is the default size for the smallest counts and 22 for the largest).

<?php $args = array('taxonomy'  => array('post_tag','category'), ); wp_tag_cloud($args); ?>

Display a tag cloud of your categories and your tags.


Conclusion

By adding an archives page to your website you are giving your readers and search engines more ways of finding your best content. It's such an easy page to set up that it's surprising that more themes don't come with an archives template included.

Remember, even though we have used the default Twenty Eleven as an example throughout this tutorial, the steps that we have taken can be applied to any modern WordPress theme.

Good luck - Kevin

Advertisement