Recommended Reading
In the beginner series we built an all in one archive page for our theme that handles all four archive types, Category, Author, Date, and Tag. To pull it off, we used some of WordPress’ conditional functions to check if the page being loaded was a particular archive page, so that it would generate the right heading accordingly. If you’re curious, you can check the code for archive.php to see what we’ve done.
What We’re Building
We’re going to build three new pages today, author.php, category.php, and tag.php. We’re not going to build date.php as this theme is more for bloggers, writers, and so on, than it is for a use that would benefit from such a page, a news site for instance. That said, you are able to apply the same principles to build it should you choose to do so.
Creating an Author Archive Page
Create a file called author.php in your theme’s directory, and paste the contents of archive.php into it.
Near the top of the file you’ll be able to find the following. Delete everything except the second last line, as we still require that.
<?php /* If this is a category archive */ if (is_category()) { ?>
<div class="archives page-header"><h1>Browsing Articles In: <?php single_cat_title(); ?></h1></div>
<?php /* If this is a tag archive */ } elseif( is_tag() ) { ?>
<div class="archives page-header"><h1>Tagged: <?php single_tag_title(); ?></h1></div>
<?php /* If this is a daily archive */ } elseif (is_day()) { ?>
<div class="archives page-header"><h1>Archive: <?php the_time('F jS, Y'); ?></h1></div>
<?php /* If this is a monthly archive */ } elseif (is_month()) { ?>
<div class="archives page-header"><h1>Archive: <?php the_time('F, Y'); ?></h1></div>
<?php /* If this is a yearly archive */ } elseif (is_year()) { ?>
<div class="archives page-header"><h1>Archive: <?php the_time('Y'); ?></h1></div>
<?php /* If this is an author archive */ } elseif (is_author()) { ?>
<div class="archives page-header"><h1>All Posts By: <?php echo get_the_author() ?></h1></div><!-- don't delete me -->
<?php } ?>
If you save your author.php, and open up an author’s profile page on your site, you’ll see something like this.
Common practice for author archive pages is to display the author’s profile information — especially prevalent on multi-author sites — and in the last tutorial where we created an author profile to add to single.php, we deliberately put the profile in a new file, so as to use get_template_part to display it wherever we like.
This means we can do exactly what we did before in order to display the author profile. So go into author.php, and just below where the author name is generated put the following:
<?php get_template_part( 'author', 'single' ); ?>
Save and refresh, and you should see something similar to this generated.
Some would argue, myself included, that there’s too much space between the bottom of the author profile and title of the first post. If you’d like to reduce it you can add the following to assets/css/style.css:
.author .post {
padding-top: 0;
}
If you’re wondering where these classes have come from, author is on <body> thanks to body_class, post comes from the very similar post_class, which you can see in the author template file.
That’s how we’re going to leave our author archive page for now, if you wanted to take it further, you could very easily use the same grid layout we did on our homepage, or you could choose to remove the description and just have links.
Onward, to the category page.
Creating a Category Archive Page
As you could safely assume, create category.php in your template directory, and paste the contents of archive.php inside, once again deleting the majority of the code that is there to detect what kind of archive page is being requested, except for the line that generates the title, referenced below.
<div class="archives page-header"><h1>Browsing Articles In: <?php single_cat_title(); ?></h1></div>
In effect, we’ve created exactly what we had before, but sectioned it off into a file of it’s own. Something you can do to make the category page more useful is to show the category description, in fact I can hardly think of a site that wouldn’t benefit from that, and naturally, WordPress has a function built in which we can use to achieve this.
Note: To get the most out of this part you’ll need to have at least one category description filled out, so head into the WordPress Dashboard and make sure you’ve filled at least one out. If you’re using the WordPress Unit Test Content and therefore working with dummy content, I suggest throwing some filler text into the Uncategorized category description.
Directly below the category title, we need to use category_description to display just that, like so:
<section><?php echo category_description(); ?></section>
Note we need use echo, otherwise it works in its default form. It’ll pull the category description for the current category. You can definitely use a category id if you want that in a specific place, but for us this is just fine. Otherwise I’ve simply wrapped it in a section as to give it some padding and be consistent with the rest of the page and theme.
Our next step is to delete the meta data, excerpt and read more button, this turns the category page into more of a resource based layout, as due to the description we don’t really need excerpts there. This is what we’re left with:
Once again, my issue lies with the amount of padding between each post, and indeed between the description and first post. It’s a combination of the padding inherent on the sections and margin on the page-header divs. In order to keep things simple we can just jump onto the styles we wrote before like so:
.author .post, .category .post {
padding-top: 0;
}
Which makes for a much more acceptable layout
Now it’s time to move along to the tag archive, and see how we can tidy that up.
Addressing the Tag Archive Page
Create tag.php in the theme’s directory, and once again paste the contents of archive.php into this but be sure to delete the top code block, leaving only what’s required to generate the tag’s name as the title.
Now is to decide what to do with it. It’s very easy to create a tag page that’s basically the same as the category page, as the equivalent functions, ie: tag_description, exist for such a purpose. Though generally, sites tend to be organized by either categories or tags, not often both, which may influence what you choose to do with your tag archive page.
For our theme, we’re going to roll with a very basic tag archive, indeed just leaving it as it currently stands, as we’ve already created a more useful category page. Naturally you can choose your own adventure, and flip it around and use tags over categories, if you would like.
Winding Up
We’ve created more useful author and category archive pages, making use of some new WordPress functions to do so, and that’s where we’re going to leave it for now. We’ve also created a very basic tag archive, and have opted to not create a date archive, as this isn’t a content-by-date oriented theme.
Coming up in the next parts of Couch to WP Pro Intermediate we handle custom post types, the Theme Customization API, and Internationalization amongst other things, stay tuned!
The post Part 4: Creating More Useful Author and Category Archive Pages appeared first on YinPress.