Wicked WordPress Archives in One Easy Step!

If you’ve been blogging for any length of time, then odds are good that your archives are stuffed with posts that people might find interesting or useful. Problem is, when your best articles disappear from the home page, they descend into the depths of your site, landing in a lonely place known as the archives.

We all know that people don’t actually read stuff on the Web — they scan it, looking for content that is not only pertinent to them but also offers a clear and distinct benefit. In most cases, this is a rapid-fire process, and if somebody has committed enough time to even get to your archives, you can bet on the fact that their willingness to hunt for relevant content is dropping every second.

Therefore, if you want your archives to be effective (because most archives are decidedly not), then you need to provide specialized archive views that place a premium on scannability. Fortunately, you can accomplish this with almost no effort in one easy step!

Over the last few months or so, I’ve seen and spoken about a couple of great ways to expose your readers to older content:

How to Create Archives with Real Sex Appeal

If you said the first one, then I suppose you’re one of those types who “only reads it for the articles.”

But you’re not foolin’ me or anyone else around here :)

So, how do we change our boring archives into beautiful, unique pages with images that just beg to be scanned? The answer lies with the Optional Excerpt, a feature of WordPress that is utilized by most themes when displaying your archives 1.

All you have to do is copy and paste a paragraph or two 2 from your article into the Optional Excerpt box, and then for maximum appeal, be sure to add a descriptive image along with the text. Or, if you really want to get creative, you can type up a brief summary of your post — a teaser — to try and “sell” visitors on the merits of a particular post as they scan your archives.

The primary reason why you’d want to do this is because WordPress does not apply any styles to auto-generated excerpts.

In layman’s terms, this means you end up with big, ugly blocks of text that lose all semantic meaning — paragraph breaks, lists, links, bold, italics, you name it — it all gets nixed if you let WordPress auto-generate an excerpt. The results are not attractive, and you can probably see why users generally don’t respond well to archives.

Simply put, unformatted information is extremely hard to scan, and if you’re serious about publishing on the Web, you need to do everything you can to improve the scannability and allure of your site.

So, do your visitors a favor and take back your archives by utilizing the Optional Excerpt field in your posts.

Oh, and did I mention that it gives you yet another avenue for producing properly-formatted text on pages that will get indexed by Google?

Heck, if you don’t want to do it for your readers, at least do it for your friends, the search engines!

1 This will only work if your archives are constructed with excerpts (the_excerpt()). Some themes, like K2 for instance, offer “live archives” or other alternative methods of display. In my opinion, these do nothing to solve the scannability problem, and the fact that they are so similar to regular blog pages makes me think that users would be less likely to delve into the content to find something of interest. If you’re on an architecture that doesn’t utilize excerpts for displaying archives, you may want to reconsider your options as far as themes go. ↩

2 If you use the teaser approach to publishing like I do, I recommend simply copying and pasting everything that comes before the <!--more--> tag into the Optional Excerpt field. ↩

It’s a great idea to place a key image thumbnail in the opening lines of your post. It provides a visual ‘vignette’ for searchers going through your archives and also shows up in aggregators (like BritishBlogs, or WordPress.com tagsurfer) to ‘lift’ your material above background.

You should ensure that your image placement works in both blog front page and single post displays, where an image at the very top of a post can often be wiped out by the post title.

I’m on the wordpress.com server (and I know, Chris, that you would never make comment on that), and all I need to do is to insert the stuff into my post – and lo, in my archives I have the “excerpt” with image and text. And I agree, it is a lot better than just having post titles – which sometimes fail to be that descriptive.

I haven’t really thought about this. This is a great idea. My archives are so boring and I am trying so hard to provide great content that is only seen for a couple of days before vanishing into archive hell.

I definitely like the look of the “vibrant” archives. The only downside I see is that the example doesn’t necessarily show that there is more content to each article, such as a “click here for more . . .” link at the end. The view is great, but it is not obvious that there is more content with each of the articles. Is this just a function of the template?

I totally agree with you. Yes, it’s a function of the template, and I could actually change it to make it act just like the front page does.

But then, that would eliminate the need for an excerpt, and in addition, some of your flexibility would be lost.

For instance, you would not be able to write a teaser containing text that is independent from the content of the post. Also, you would have to live with the positioning of the pictures in the beginning of your post.

Personally, I like to move the images around in my excerpts so that my archives alternate. Then again, I am probably a lot more anal about this than most people!

Yes it absolutely resonate with me. Visitors are the one who values your blog if they like not only the text but the design and look and formatting of the text. Readability and that is also quick is one of the most important factor in blogs.

If you are publishing via Ecto on OS X, there is an option in the preferences to do a pretty good automatic job of this.
It uses the OS X Service called Summarize. It using swooshyness to summarize your text.

For instance: This is your post summarized:

“We all know that people don’t actually read stuff on the Web — they scan it, looking for content that is not only pertinent to them but also offers a clear and distinct benefit. In most cases, this is a rapid-fire process, and if somebody has committed enough time to even get to your archives, you can bet on the fact that their willingness to hunt for relevant content is dropping every second.

…All you have to do is copy and paste a paragraph or two 2 from your article into the Optional Excerpt box, and then for maximum appeal, be sure to add a descriptive image along with the text. Or, if you really want to get creative, you can type up a brief summary of your post — a teaser — to try and “sell” visitors on the merits of a particular post as they scan your archives.

…In layman’s terms, this means you end up with big, ugly blocks of text that lose all semantic meaning — paragraph breaks, lists, links, bold, italics, you name it — it all gets nixed if you let WordPress auto-generate an excerpt.

…Simply put, unformatted information is extremely hard to scan, and if you’re serious about publishing on the Web, you need to do everything you can to improve the scannability and allure of your site.”

And this is it shrunken down to one sentence:

“We all know that people don’t actually read stuff on the Web — they scan it, looking for content that is not only pertinent to them but also offers a clear and distinct benefit.”

I agree with everything you say – but I’m still not sure how to go about creating these great looking sidebar navigation elements, such as you use here on this blog. I want to add categories such as reader favourites and author favourites, as a way of leading visitors to articles that might interest them. Abd perhaps a ‘must read’ as well. Any chance of an idiot’s guide to doing that? And when I say idiot, I mean someone who knows nothing about php.

OK – S0… How to do this? I’m not sure it works with my theme or I am doing something wrong. Can you direct me to more details on implementing the cool archive page? Don’t you just hate comments like this?

OK – I see… When I clicked on the link in your post I thought I was looking at a generic archive page. I was really looking at a particular month and year. I can make mine do the same thing with excerpts or full content.

For me I needed to edit my archive.php and change the_content() to the_excerpt(). I also removed the display of tags.

What I am trying to figure out is how to have a simple list of all posts on a page with the fancy excerpts.

Thanks, Brian. I’m using Thesis, and I didn’t know what to do. But I was able to change the_content() to the_excerpt() in my archive.php and it worked!
Thanks, Chris. It looks a lot better. Now I just have to fill in all of those excerpts…

As I said above, I like this tip. But I’m not sure how to include the “Read more” links in the excerpts. Carlton mentioned it in the comments above, but I’m not sure it was ever resolved. How can I add a “read more” link to my archive excerpts?

I tried adding the code generated from the “more” button in the blog content editor to the excerpt box but nothing showed up. I see, Chris, that you said it was a function of the template, but I’m still not sure how to add it. Without it, I don’t think it is obvious that the reader should click-through for more content.

Brock — By default, WordPress doesn’t come with an elegant way to handle this, but you do have one option for getting your “click to continue” (the equivalent of “read more”) links to work immediately.

Instead of using the_excerpt() on your archive pages, you can use the_content('[click to continue&hellip;]'). Assuming you’ve added <--more--> tags to your posts, this will result in excerpts that are identical to those found on your homepage when you first publish your articles.

Now, separately, I could create a function to detect the use of the_excerpt() in your archive pages, and then I could render a helpful “read more” link after printing out the excerpt. This is precisely the kind of thing that makes sense in a theme like Thesis, or if you’re pretty savvy, in a custom WordPress function.

John — I code up all my footnotes manually. You can view the source to see exactly what I did… I use the regular old text editor inside WordPress (and not the rich visual text editor), and I simply type in the footnote HTML that you see in the source.

I’m a WordPress beginner.
I read your answer to John Haydon.
I did as you said and create a footnote as you did.
So, first Thanks for the advise.
Second, I got involved with the tag inside the .footnotes div. At first time I’ve got something like this 1 Text…then empty .

John — To use an analogy, Thesis is like a brand new, LEED-certified green building that was designed by an architect. This template, on the other hand, is a rickety bungalow designed by someone who knew how to put a house together but didn’t know how to do much else (aka me in 2006).

Outside of manually-coded tomfoolery, the current Pearsonified template has no functionality at all… It just knows how to spit out content from a WordPress database.

There is a pretty high demand for a Pearsonified-esque template, and because of this, I’m going to offer a Thesis “skin” at some point in order to satisfy this demand. No ETA on that yet, though.

@Chris – A “Pearsonified” skin for Thesis would be awesome. There are several features of this site that I really like. But I also appreciate the care you are putting into Thesis, so I’m more than happy to wait while you focus on the fundamental features. The glitzy stuff can always come later, right?

VERY SEXY! Your archive pages look fantastic. Yes, it would seem that visitors would rather scan an archive page than read through your entire category or tag set. Great job! Im doing this on two of my wordpress blogs. it just makes more sense.

I just want to tell you that I am new to blogging and site-building and definitely savored your page. Very likely I’m going to bookmark your website. You absolutely have really good article content. Bless you for sharing with us your web page.