WordPress Wednesdays: Automatic Archives Page

March 2, 2011 — 6 Comments

This WordPress Wednesdays entry is a re-post from Matthew’s old blog as we resurrect them here at GeekRev.

I have been asked a by a few of the G4H community members to do a WordPress Wednesdays post about my Archives page. If you check out the Standard Theme, or even use it, as I do, you would see the awesome power of it.

With the above said I am going to go into a short tutorial on how to add an automatically updating archives page.

Let’s start with the assumption that you already have an archive.php within your theme files. You will need to navigate to that file and understand the overall architecture of it. For this archives page we are going to setup a template that you can apply to your own archives page.

If you are tired of reading already – the entire code for this template is below!

I will show you how to apply a template to your page once we are done with the magic code to make it look slick.

Let’s get dirty in code!

Starting off with building a template page, we will need to create a new file named archives page template (archives.php). I would grab the existing archive.php file (or any .php file) in your theme’s folder and copy it to your hard drive. Rename it to archives.php for the use for this tutorial. Once that is done, open it with your favorite text editor and delete all of the text inside.

With a blank canvas we need to start off with the common WordPress calls to say “this file is a template file” by adding the following at the very top of your file.

<?php /* Template Name: Archives */ ?>

Next in the calling order, you need to call the all important header. Without the header call, nothing will show in your page. Below is the code, try and type it out instead of copy and pasting it in, helps in remembering some of the code.

<?php get_header(); ?>

We now need to call out the post itself by calling the <div> in which it lives. But first you need to make sure that you are calling the correct things first.

The post lives within the content so it should be something like this.

<div id=”content” class=”col-full”>
<div id=”main” class=”col-<?php echo main_content_orientation(); ?>”>
<div class=”post”>
<div id=”main” class=”col-<?php echo main_content_orientation(); ?>”> <div class=”post”>

We need to be able to read what the title says along with the name of the headers. The next portion of code calls out the name of the page – Archives – along with the first heading which you can name as you want. Below is the code.

<h2 class=”title”>

<?php the_title(); ?>

</h2>

<div class=”entry”>

<h3>

<?php _e(‘The Last 30 Blog Posts:’,'standardtheme’); ?>

</h3>

Say you wanted your archives page broken into three sections:

  1. The Last 30 Blog Posts
  2. Categories
  3. Monthly Archives

The last 30 blog posts is an easy query to the database and a little magic from within WordPress. The code below makes a query to the database for the last 30 posts, makes them show their permalinks, title and then the comments after it.

<ul>

<?php query_posts(‘showposts=30′); ?>

<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>

><?php $wp_query->is_home = false; ?>

<li>

<?php  the_time(‘Y, M j’) ?> – <a href=”<?php the_permalink()  ?>”><?php the_title(); ?></a> – <?php echo  $post->comment_count ?> <?php _e(‘Comments’,'standardtheme’);  ?>

</li>

<?php endwhile; endif; ?>

</ul>

So the first part of the magic is done. This will auto update as you post new items on your site. It will always show the last 30 blog posts.

Again we need to call the title of the next section which is the Categories section.


<h3>

<?php _e(‘Categories:’,'standardtheme’); ?>

</h3>

You do not need the standardtheme call for your theme file, it’s not necessary. But it doesn’t hurt either I assume.

Next is the call to show you the categories.


<ul>

<?php wp_list_categories(‘title_li=&hierarchical=0&show_count=1′) ?>

</ul>

This call shows you all of the categories along with the count of posts within the category itself.

Last but not least is the actual archives themselves. This call to the database will show you the archives along by date along with how many total posts are in each month.


Now all you have to do is close up your template file by closing all of your divs and adding

<?php get_sidebar(); ?>

</div>

<?php get_footer(); ?>

Now on to adding this to your theme itself.

Start by hitting the pages widget on the admin side of your WordPress install. Once there create (if you don’t have one yet) an archives page. Once created, there will be a widget on the right side of the page named Page Attributes.

Select your Archives Template from  the drop down and hit save. Now link to it.

You are done!

Thats all folks.

For those of you who just skipped this entire post, here is the file saved for you all to access.

herbhalstead

Posts Twitter Facebook

Herb is the lead pastor at Thrive Church. Herb also does freelance web design, 3D architectural modeling, and works as an architectural designer.

6 responses to WordPress Wednesdays: Automatic Archives Page

  1. I’m working on a new design this week and I’m going to try this out. I’ll let you know how it goes!

  2. I loved as much as you will receive carried out right here. The sketch is attractive, your authored subject matter stylish. nonetheless, you command get got an nervousness over that you wish be delivering the following. unwell unquestionably come more formerly again since exactly the same nearly very often inside case you shield this increase.

Leave a Reply: