15 Creative Ways to Display Date Archives

Every time I start playing around with a different WordPress template I get to the archive page and I’m stumped because I’ve never been able to think of a creative way to display date based archives.

So I went on the hunt to find 15 different ways to display date archives. Some are definitely more creative than others but they’re all worthy of taking a look at to see what works and what doesn’t.

Select Menu Drops Down Months

Diary of a Website / in the sidebar

This is a very simple way to display date based archives, in a form select menu. Usually this is built into most blog tools and can be displayed with just one tag. This is a popular solution when you don’t want an individual page, and you just want the archive to fit in a small space in the sidebar.

Listing your Months in the Meta Area

jek2k.com / it drops down from the ‘lost?’ button

This is the default for many blog themes in the Hemingway family. It’s a list that lives in a ‘meta’ section of the site that is typically at the bottom of every page or in this case drops, using JavaScript, form the ceiling of the page. This is another great solution when you don’t want a separate page for the archives. And want the month archives to be easily accessible from any page.

A Big Long List of Months on it’s own Page

Copyblogger / archive

Having a list on it’s own separate archive page is great once you have more than a year’s worth of posts. Jamming a list into a sidebar or meta area like the example here, on Copy Blogger, would create clutter. Though in this exmaple separating a simple listing of months onto a different page doesn’t create any context for the posts. So if the date is critical it would make sense to display this way but most blogs emphasize the content rather than the date. So this would not be the ultimate and final solution for most blogs.

Calendar Display for Date Based Archives

Anthology of Ideas / archive

Calendar based archives are something you don’t see too often. They’re not incredibly useful since there isn’t a lot of context. The most effective uses I have seen for calendar based archives are usually in photoblogs where it’s all about the image and you can effectively display the content (image) in a calendar based setting.

See the sample using a photo based calendar, it effectively communicated the content (photography) and the importance of the date based archive. Screen sample from Blogstyle.com Movable Type photo archive tutorial. I think it would be a challenge to display titles of posts within a small calendar table, unless you made it replicate a Google calendar look.

Creating the Post Cloud

Uneasy Silence / archive

This method of listing posts by month lists them in a format that looks a lot like a tag cloud. Of course the key to tag clouds is to create a size or color based hierarchy to show the most popular or most commonly used tags. I don’t think this effectively highlights the important, key or popular posts, if it did I’d probably be a bigger fan of this archive style.

Simple, Clean, Effective

Lifeclever / archive

This solution focuses on the posts, organizing them in monthly groups. The day of the month the post was added isn’t important information so it’s not displayed on this list. This blog is aimed at a more creative user base so a simple clean list with minimal detail and good use of titles is in their best interest. That makes this a good solution for a blog that is content heavy with articles well described by their titles that don’t been to be put into any other context.

Simple and Clean: Meet Information

Garret Dimon / archive

This very effective display highlights the post by months and again doesn’t emphasize the detail of the day of the month. This one does put into perspective how old the post is by adding in a relative date and lists the number of comments, which often tells readers how popular and how many responses there are to that particular entry. This archive displays a lot of information but keeps it clean and organized.


JavaScript Expanding Archive

WordPress 2.0 Spot-er / archive

This expandable version allows the user to decide what they want to see without reloading a whole new page, still allowing easy access to the next or previous time frame. This is presumable accomplished using the WordPress plugin Clean Archives . I thinks this is an excellent solution if you find a list of posts to be overwhelmingly, especially in circumstances where you have more than 150 posts or you post more than 15 times a month like in the example.

The Live Search Appear in the Archives

Ordered List / archive

This very effective archive page displays all of the posts listing well made titles and orders them by date, with the emphasis placed on the titles. The search acts like a live search and filters out posts depending on the queue. This is as effective if not awesome solution. I like it, like it a lot and find it more effective than a separate search page and a page that lists all the posts with attention only paid to the publication date.

Bigger Blogs need Filtering Systems

Apartment Therapy / archive

This is interesting, weekly! That’s the first thing I think when I see the drop down menu. You probably need it when you have a huge blog with a number of posts per day, each attributed to different subsections of the blog (in this case a location.) I also really like the way that the archives can easily be filtered by those subsections within clos proximity to the week drop down, creating a filter area. Great usability!

Another thing that is great about this archive is that it displays summaries about the article which adds context and interest to the piece and is great for searches! I strongly recommend writing summaries and excerpts for all your articles, not just for use in archive pages but also for the many other places in a blog template they can effectively be used; meta tags and searches included.

Yeas then Months not Months of Years

Brainstorms and Raves / archive

Not necessarily the most interesting way to display date based archives but this example provides a interesting variation. Usually you will see months separated by month/year but in this example you see segments of years with month subsections. I’ll admit, I think this might be stronger if it integrated posts below those months like we will see in upcoming samples.

Multi-Displays: Year/Months and Recent Months

Veerle’s blog / archive

This display provides two options, a simple tab system to display months as a subsegments of the years. One of the other strong points is that this archive page also displays the posts from the past two months. This could be a big help to readers who have seen a post recently and now instead of having two clicks from the home to the archive to a month based page, there’s only one click from home to the archive for the most recent articles.

In most cases where there’s only a couple posts a month it would make a lot of sense doubling up on months or eliminating the month archive page in lieu of the year archive page.

Year/Month Tabs Meet Dynamic Content

Larissa Meek / archive

This tabbing is similar to the style we looked at above with Veerle’s archive page but the posts display below the Year/Month tabs using JavaScript without loading a month archive page. This is highly usable and very clean way to organize and display the information. This idea is fantastic and well executed for the needs of this particular blog.

Simple Table

Komodo Media / bottom of the page

This is another example of displaying month archived with the months as subsets of the years. The thing I really like about this display is that it retains the months that there aren’t posts for. It help retain a consistent time line and I sure love a good display of tabular data! This creates a great compact display of a lot of information, that’s why it’s so easy to pt it at the bottom of the pages.

Three Columns & All About Consistency

Bearskinrug / archive

This is a great example of a usable date archive system. In a three column layout they use the left column to display the dates, organized by month as we have seen a few times already, but then they keep that same navigation to display the articles for that month in the center column. This example does not use JavaScript, making it work in both JavaScript enabled and disabled environments and it works beautifully for this site to display it’s image based articles.

So there you have it, we took a look at 15 different date based archives. Some were clearly better than others but it always depends on the needs of the site.

It might help you as an author to post something like a calendar but would it help out your visitors? Post any other great date based archives for everyone to see, if you leave a comment make your url the link to your archive so we can check it out.

Now I’m off to go figure out what would be best for me!

This site runs on the Thesis WordPress Theme

Thesis Theme thumbnail

If you're someone who doesn't understand a lot of PHP, HTML, or CSS, Thesis will give you a ton of functionality without having to alter any code. For the advanced, Thesis has incredible customization possibilities via extensive hooks and filters. And with so many design options, you can use the template over and over and never have it look like the same site.

If you're more familiar with how websites work, you can use the fantastic Thesis User's Guide and world-class support forums to make more professional customizations than you ever thought possible. The theme is not only highly customizable, but it allows me to build sites with a much more targeted focus on monetization than ever before. You can find out more about Thesis below:


Comments on this entry are closed.

Previous post:

Next post: