It’s common practice in blogging to have a page on your site that can be helpful for both search engines as well as vistors to navigate to places they want to find.
In some cases they are called sitemaps, while others folks call them archive pages. Either one can look a number of ways, depending on what you want to display. If you want to create a custom archives page, follow the steps below.
(This tutorial assumes that you are using the Genesis Framework for your site.)
Set up Your Archives Page Template
The first step is to create a page template for your child theme – you can name the file archives.php. You can name it whatever you want, but I usually tend to keep the file names short and descriptive.
You’ll want to establish that this is going to be a page template, so at the very top of your file, place the following code:
<?php
/**
* Template Name: Archives
*/
The code above will add “Archives” to the available Template options in the Page Attributes section on the edit page screen in your WordPress dashboard.
Unhook the Genesis Standard Loop
Every page (and post for that matter) runs the Standard Loop that is built into the Genesis Framework. This includes all that you enter in your text editor and commonly output as <?php the_content()?> in traditional WordPress themes.
Since you want to customize what is shown in the content area of your site, you’ll need to unhook the Genesis Loop. Add this to your archives.php file:
remove_action( 'genesis_loop', 'genesis_do_loop' );
Write Your Custom Archives Function
The last step is to establish your custom archives function, where you’ll place the code you want inside of it. Place the following code into your archives.php file:
add_action( 'genesis_loop', 'custom_archives' );
function custom_archives() { ?>
The code you see above names the function custom_archives and then hooks the function to the genesis_loop hook. Pretty nifty, eh?
Next you’ll want to add some code – for example, you can show an unordered list for each of blog category.
Here’s a sample of code that you can use:
<h1 class="entry-title"><?php _e('Blog Archives', 'genesis'); ?></h1>
<div class="entry-content">
<p><?php _e('Interested in what I have to say by category? Well you can search below...', 'genesis'); ?></p>
<h4><?php _e('Blogging', 'genesis'); ?></h4>
<ul>
<?php $recent = new WP_Query("cat=1&showposts=20"); while($recent->have_posts()) : $recent->the_post();?>
<li><a href="<?php the_permalink() ?>" title="<?php the_title_attribute(); ?>"><?php the_title(); ?></a> | <?php the_date(); ?></li>
<?php endwhile;?>
</ul>
</div><!-- end .entry-content -->
To make things easier to read, this is a sample one block code for one category. You’ll see that the category ID is 1, that the list will show at most 20 posts.
Close out the Function and Archives File
Lastly, you want to place the following code into your archives.php file:
<?php
}
genesis();
This closes out the php code you placed, the custom_archives function you wrote and then runs the rest of the Genesis code. While it doesn’t seem like much, this code is essential inside your archives.php file.
Sample Custom Archives Code
To provide you a full snapshot of what I’m using, I’ve placed my entire archives.php file into a zip which you can download for your personal use.
Great tutorial!
Thanks Lindsey – I’m hoping to write up more of these tutorials, as I’m asked quite often how I do things on my blog.
Wait?! You’re gonna show people how to consume your product by teaching them how to use it to a higher degree???
That’s crazy, Brian! If you start doing that, more people are going to want to buy your product and you’ll make more money and then you’ll have tax problems!
Don’t do it man! For goodness sake, think about what you’re doing!
What if this type of subversive activity catches on?!
I’m begging you, my friend, reconsider before it’s too late!!!
Sheesh! The next thing we know, you’ll be teaching people how to mod your themes out big-time and then they’ll do that too
Heh, thanks for the laugh Mike… quite often I take for granted how easy it is for me to work my way through Genesis and make it do what I want. I’d like to do what I can to make that easier for other folks.
Hey Brian
I actually understood that. LOL
Appreciate the statement “In some cases they are called sitemaps, while others folks call them archive pages.” I didn’t realise that the two were the same.
Looking forward to a few more easy tuts.
It’s funny, because they can be the same, or different. Either way, it’s a matter of how you want to display your site architecture for a) your visitors and b) search engines.
I just spent hours looking for this the other day. Thanks much!
Awesome. This is JUST what I was looking for! Thanks Brian!
Great to hear – let me know if you end up using it and send me a link to your archives page!
While I continue to be amazed at what you can do with Genesis+Child Theme in a fairly “stock” configuration, it is inevitable that you will want to proceed to more customizations as you continue to refine that site. The “you must be this tall to get on the ride” gatefor entry has previously been fairly high because the coding aspect can be fairly intimidating for a beginner/ advanced beginner and the tutorials themselves assume a fair amount of knowledge.
Great job lowering the height of the “gate”. Makes me want to go try this! Any resource like this will much appreciated by your user base!
You’re welcome Darryl – I find that I have so many instances of code snippets, custom files, etc that I’ve written over the past couple of years that it only makes sense to post them here for others to benefit.
I’m assuming the archives.php should be uploaded into the /wp-content/themes/(THEME NAME) folder? Correct?
Yes, that’s correct.
Worked like a charm. Finished product:
http://couponingchic.com/couponing-101
Good stuff Brittany – thanks for sharing!
Thank you! Now only if you could make a tutorial on how to add category specific icons to post titles…*hint* *hint*
This code worked great. However I am having an issue with the sidebar being display underneath the full page template. I’ve tried everything to get rid of the sidebar but the php somehow keeps pulling it up.
Is there a code I can add to get rid of the sidebar.
Here is the website to see what I am talking about.
http://www.biodynamichealing.com/article-archive/
Are you using a sidebar widget plugin or something? Not sure why your sidebar would be loading.
Actually I am using the genesis custom sidebar widget/plugin that let’s me create multiple sidebars for the different sections. Is that where the issue is?
Brian — does this modification not work with the “Magazine” child theme?
It should work on any theme – why, ae you experiencing an issue?
I was, but I fixed it.
Up above here it says to name the file archives.php — that failed me completely. I did a little digging and found out the file is supposed to be named archive.php (without the S).
Problem solved.
More here: http://codex.wordpress.org/Category_Templates
Any more thoughts on my issue with the sidebar showing up even on a full page template. I responded that I am using the official genesis customer sidebar generator plugin.
Before reading this tutorial I was using plugin for that, thanks for this article, no necessary to use plugin now.
Hi Brian,
In my previous post I asked about my problem with the Archives. Here is the update. My first mistake: I put it in my local folder. Once I realized I uploaded it to WP. Now I see it in the Editor. Next thing I realized is that it is a ‘template’ and not a widget. So, I created a page and used the template ‘archives’. Now I think I figured it out and need to do further configuration. Just wanted to let you know – I am still figuring it out Archives page file…..
Thanks,
Spencer
HI Brian,
It is done… I figured it out and now I have a Archive page, which I will add to the submenu. Thank you. You can now delete all my comments since I figured it out.
Hey Brian,
I love this post, definitely putting it to use. Got a question for you though. How can I edit the code to make it so the archive page can posts a thumbnail and a post excerpt as well?
This is kinda of a loaded question and would require some custom code. And sorry for the delay in response, this comment was marked as spam for some reason.
Hi Brian,
Thank-you for sharing this post. It was very helpful and informative on a site I’m currently working on.
This is great coding. I like it… because I need it I guess,
Because I didn’t know how to work this, I used joomla for bigger sites, to hide and show pages and stuff as I liked.
This in combination with custom menus give a lot of possibilities.
Bless ya.
Hope to find out more on how to “manipulate” this coding on showing the catogery hierarchy and stuff.
hi Brian.
If i want to show list post (1 to 10) then i want list other (20-40) from category ID=1 which code will help me do that?
This is kind of a loaded question, and honestly better suited for our community forum to answer.
Hey Brian,
First of all, thank you! I was finally able to get my custom template to show up using your method, modified a little bit. The problem I am having now is that the “content” is showing up before the menu instead of in the middle of the page or “blog” section. I am using the eleven40 theme, so I am just looking for the code to display the content AFTER the menu and such.. Do you know by chance what that would be?
Is it possible to configure this to work for month/year archives, which would give us pages similar to this: http://www.thedesigncubicle.com/2012/07/?
Well that would probably require some additional coding, but pretty much anything you want to do is possible with Genesis and page templates.
Thanks Brian for this tutorial.
Thanks Brian, this worked nicely. see:
http://weirdnewsfiles.com/weird-news-archives/
Drew