The Archive Template

What archive.php does (and all its related templates) is show posts based on a select criteria. A date range, or posts by a certain author, a category, or a tag. So, basically, it’s a lot like index.php.

Our theme will have one multipurpose archive.php template to cover date, category, author, and tag archives.

If you want to use a separate template for each type of archive, then you can create separate template files for them, for example: category.php, author.php, and tag.php. If WordPress doesn't find a specific template file for each type of archive, it will default to archive.php.

The Archive Template

Here’s what our multipurpose archive template will do:

  1. Call the_post()
  2. Check to see what kind of archive this is (date, category, author, or tag)
  3. Produce an appropriate title and, if it's a category or tag archive, display the category or tag description (if they've been filled out in the Dashboard)
  4. Rewind the posts with rewind_posts()
  5. Do the usual loopy WordPress stuff

Without further ado, let's get coding. Open archive.php and add the following to it.

<?php
/**
* The template for displaying Archive pages.
*
* Learn more: http://codex.wordpress.org/Template_Hierarchy
*
* @package Shape
* @since Shape 1.0
*/

get_header(); ?>

<section id="primary" class="content-area">
<div id="content" class="site-content" role="main">

<?php if ( have_posts() ) : ?>

<header class="page-header">
	<h1 class="page-title">
		<?php
			if ( is_category() ) {
				printf( __( 'Category Archives: %s', 'shape' ), '<span>' . single_cat_title( '', false ) . '</span>' );

			} elseif ( is_tag() ) {
				printf( __( 'Tag Archives: %s', 'shape' ), '<span>' . single_tag_title( '', false ) . '</span>' );

			} elseif ( is_author() ) {
				/* Queue the first post, that way we know
				 * what author we're dealing with (if that is the case).
				*/
				the_post();
				printf( __( 'Author Archives: %s', 'shape' ), '<span class="vcard"><a class="url fn n" href="' . get_author_posts_url( get_the_author_meta( "ID" ) ) . '" title="' . esc_attr( get_the_author() ) . '" rel="me">' . get_the_author() . '</a></span>' );
				/* Since we called the_post() above, we need to
				 * rewind the loop back to the beginning that way
				 * we can run the loop properly, in full.
				 */
				rewind_posts();

			} elseif ( is_day() ) {
				printf( __( 'Daily Archives: %s', 'shape' ), '<span>' . get_the_date() . '</span>' );

			} elseif ( is_month() ) {
				printf( __( 'Monthly Archives: %s', 'shape' ), '<span>' . get_the_date( 'F Y' ) . '</span>' );

			} elseif ( is_year() ) {
				printf( __( 'Yearly Archives: %s', 'shape' ), '<span>' . get_the_date( 'Y' ) . '</span>' );

			} else {
				_e( 'Archives', 'shape' );

			}
		?>
	</h1>
	<?php
		if ( is_category() ) {
			// show an optional category description
			$category_description = category_description();
			if ( ! empty( $category_description ) )
				echo apply_filters( 'category_archive_meta', '<div class="taxonomy-description">' . $category_description . '</div>' );

		} elseif ( is_tag() ) {
			// show an optional tag description
			$tag_description = tag_description();
			if ( ! empty( $tag_description ) )
				echo apply_filters( 'tag_archive_meta', '<div class="taxonomy-description">' . $tag_description . '</div>' );
		}
	?>
</header><!-- .page-header -->

<?php shape_content_nav( 'nav-above' ); ?>

<?php /* Start the Loop */ ?>
<?php while ( have_posts() ) : the_post(); ?>

	<?php
		/* Include the Post-Format-specific template for the content.
		 * If you want to overload this in a child theme then include a file
		 * called content-___.php (where ___ is the Post Format name) and that will be used instead.
		 */
		get_template_part( 'content', get_post_format() );
	?>

<?php endwhile; ?>

<?php shape_content_nav( 'nav-below' ); ?>

<?php else : ?>

<?php get_template_part( 'no-results', 'archive' ); ?>

<?php endif; ?>

</div><!-- #content .site-content -->
</section><!-- #primary .content-area -->

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

Looks very familiar, doesn't it? We're reusing several functions and templates we've discussed in previous lessons, such as shape_content_nav(), content.php and content-aside.php, which we call up on line 80; and no-results.php, which we call on line 89.

The comments in the code should help you get an idea of what the archive template is doing, but in the next few sections, let's walk through some of the "archivey" things.

Dynamic archive title

Lines 19 through 53 above are responsible for printing out the title of our archive page. How the title appears depends on which type of archive we're viewing. Here's the code again (you don't have to paste anything since this is copied from above. Just examine and learn):

<h1 class="page-title">
<?php
if ( is_category() ) {
	printf( __( 'Category Archives: %s', 'shape' ), '<span>' . single_cat_title( '', false ) . '</span>' );

} elseif ( is_tag() ) {
	printf( __( 'Tag Archives: %s', 'shape' ), '<span>' . single_tag_title( '', false ) . '</span>' );

} elseif ( is_author() ) {
	/* Queue the first post, that way we know
	 * what author we're dealing with (if that is the case).
	*/
	the_post();
	printf( __( 'Author Archives: %s', 'shape' ), '<span class="vcard"><a class="url fn n" href="' . get_author_posts_url( get_the_author_meta( "ID" ) ) . '" title="' . esc_attr( get_the_author() ) . '" rel="me">' . get_the_author() . '</a></span>' );
	/* Since we called the_post() above, we need to
	 * rewind the loop back to the beginning that way
	 * we can run the loop properly, in full.
	 */
	rewind_posts();

} elseif ( is_day() ) {
	printf( __( 'Daily Archives: %s', 'shape' ), '<span>' . get_the_date() . '</span>' );

} elseif ( is_month() ) {
	printf( __( 'Monthly Archives: %s', 'shape' ), '<span>' . get_the_date( 'F Y' ) . '</span>' );

} elseif ( is_year() ) {
	printf( __( 'Yearly Archives: %s', 'shape' ), '<span>' . get_the_date( 'Y' ) . '</span>' );

} else {
	_e( 'Archives', 'shape' );

}
?>
</h1>

You can see that the title will be wrapped inside an <h1> tag. What falls inside the h1 tags depends on the type of archive.

If it's a category archive, the title will look like this:

Category Archives: Category Name

If we're dealing with a tag archive, we'll get this for a title:

Tag Archives: Tag Name

For an author archive, this will be our title:

Author Archives: Author Name

Our day-based archive will produce the following title:

Daily Archives: Date (the date appears in the format you set in Dashboard > Settings > General)

Monthly archive titles follow this pattern:

Monthly Archives: November 2012

Yearly archive titles look like this:

Yearly Archives: 2012

Finally, if this is an archive, but none of the cases mentioned above (e.g. not a category, tag, author, or date archive), then the title is simply:

Archives

Category and tag descriptions

So, we've taken care of the title. Now, look at lines 54 through 67 in archive.php. I'll repeat it here for your convenience.

<?php
	if ( is_category() ) {
		// show an optional category description
		$category_description = category_description();
		if ( ! empty( $category_description ) )
			echo apply_filters( 'category_archive_meta', '<div class="taxonomy-description">' . $category_description . '</div>' );

	} elseif ( is_tag() ) {
		// show an optional tag description
		$tag_description = tag_description();
		if ( ! empty( $tag_description ) )
			echo apply_filters( 'tag_archive_meta', '<div class="taxonomy-description">' . $tag_description . '</div>' );
	}
?>

WordPress lets you enter descriptions for categories and tags. This section of code checks each category or tag for a description. If it finds one, it'll display it just below the archive title (and just before the first post in the archive listing), wrapped in a div with the class "taxonomy-description".

If you would rather not have this feature, then all you have to do is delete the above block of code from archive.php.

All right, that's it. The rest of the archive template is the same goodness we've seen in index.php and single.php.

How To Create a WordPress Theme

This post is part of the The ThemeShaper WordPress Theme Tutorial: 2nd Edition that will show you how to create a powerful WordPress Theme from scratch. Read it from the beginning and code yourself up something awesome.

  1. WordPress Theme Tutorial Introduction
  2. Developing Theme Sense
  3. Theme Development Tools
  4. Creating a Theme HTML Structure
  5. Template and Directory Structure
  6. Setting Up Your Theme Functions
  7. Secure Your WordPress Theme
  8. The Header Template
  9. The Index Template
  10. The Single Post, Post Attachment, & 404 Templates
  11. The Comments Template
  12. The WordPress Theme Search Template and Page Template
  13. The Archive Template
  14. The Sidebar Template & The Footer Template
  15. Reset-Rebuild Theme CSS & Define Your Layouts
  16. Custom Background & Custom Header
  17. Distributing Your WordPress Theme

6 thoughts on “The Archive Template

    • Hi there – your file seems to be missing the opening PHP tag – be sure that’s included at the top of the file, with no blank space above it.

      Also keep in mind that category.php controls the display of category pages, not archive.php, when both template files exist in the theme – so you might want to check your category.php if you have one.

  1. I noticed that in archive.php you use instead of for the #primary.content-area. While in index.php, single.php, or any other template you used .

    Just curious; is there any reason for this? :)

    • Hi there, sure, let me try to explain. Unlike the other templates, the archives template includes page titles, which use h1 tags for “Category Archives” and similar page headings. The use of the section tag in this template ensures that the page title “belongs” to the section, and not to the entire body of the document. Here’s a resource about the section tag if you’re interested in reading more: http://html5doctor.com/the-section-element/

Comments are closed.