Ikiru Design

The Economist is without question my favorite newsmagazine. Where Time and Newsweek have spent a great deal of that last decade covering more about trends and celebrities, The Economist stays nearly as constant and high-minded as its title would suggest. And though both of those traits can sometimes be bad things, in this case I quite like them. No other publication gives you regular updates about what’s happening in so many places around the world. And I feel confident in saying that no one on the entire planet (with the possible exception of its editors) knows everything in an issue of The Economist before they read it.

Having said all of that, the magazine’s website is a little drab. Though I like the simple functionality of the “current issue” page, it’s not exactly a groundbreaking layout. The frontpage is also admirable-but-boring, giving you a quick snapshot of some of the sites freshest and most interesting content while doing a great deal to prevent the overload that comes from many magazines and newspapers.

But I recently ventured into the publication’s rather modest blog section, and I feel confident in saying that I understand why the commenters are so few and far between. The section feels rather like an afterthought.

But the biggest problem The Economist’s blogs seem to have — and this isn’t a problem particular too them — is that they look so darn boring. Their economics blog, Free exchange, does a very admirable job highlighting the problem. Upon loading the page, my first though was: “I’m supposed to read this!?” And remember: I’m an ardent fanboy of this publication.

Now before I lay into The Economist too hard, I will readily admit that I experience this often with blogs, even my own (which any fool could tell you I value much more than those of others). Large blocks of smallish text, especially in a readable-but-slightly-dull face like Verdana or Arial, is a sure way to make me think a little before reading. And as anyone experienced in the use of Digg of StumbleUpon can tell you, that second’s hesitation may well send away over half of those who arrive on the page.

Now I dislike those that to tell you that you should front-load a post with photos and pull-quotes and other eye-catching tricky to convince fools to stick around. But after looking at the blogs of The Economist I know understand the advice in a way I didn’t before. I would never advocate pictures for every blog and entry, but they can certainly make things seem a little less drab.

To avoid giving the canned “use pictures” advice, I’ve thought of a few ideas that I think could help improve the blogs of The Economist and probably could improve yours as well.

• Subtitles for blogs. The first sin Free Exchange commits is that it doesn’t tell me what I’ll find there. If I’m a quick thinker, I may make the inference that the title probably refers to something like commerce, trade, stock markets, or economics. Were I a fool (and we shan’t ever forget that I am) I would probably say “Hmm…” and either leave the site or look down the blog.
• Subtitles for content. If there is a single flaw that almost every blog on the planet (mine included) has, it’s that you don’t have more to go on before diving in than than the few words that make up a post’s title. But even the most pithy title can strongly benefit from an intriguing subtitle, as both Slate and Salon illustrate (in randomly selected articles).
• Too much sidebar. This is harder one to judge, and a much harder one to agree on. Some think that sidebars should be stuffed or exploding, I certainly don’t. One of the strongest arguments against a sizable sidebar is made by Free Exchange: a interesting sidebar easily distracts attention from your boring-looking content. This (too wide) sidebar is distracting with its ads and pictures and colorful tag cloud. All of these things make me more likely to click around (and perhaps away) and less likely to realize how good and useful the blog’s contents are.
• Hard to get around. The Economist seems to be struggling mightily to hide their blog content from outsiders. Not only is it hard to click to the site’s other blogs when you’re in one, but it’s hard to find content within that blog. Other than the distracting tag cloud, there’s the thin-and-nearly-hidden link to their month-by-month archive and a list of recent posts. All of these are rather standards in the blogsphere, but they’re hardly good. The site’s Archives page, when you finally find it, look suspiciously like the default WordPress archive that I’ve worked to correct twice before.

Those four issues certainly aren’t an exhaustive list of the (disputable) flaws in The Economist’s blogs. The clearly-broken look of their American politics blog Democracy in America is perhaps a greater sin than any of the above bullets. But I’m glad to have noticed these sins, and hope they can be instructive in my (and perhaps your) future work.

Last week, I finally switched my blog, Frozen Toothpaste, to a theme of my own creation. It’s unoriginally called “FTp_one,” after BWO_one on which it’s based. And though FTp_one will probably never be freely-available, I’m going to do my best to make any interesting aspects of it — sadly there aren’t many — common knowledge.

One of the best features in FTp_one is the Archives. I talked about how to improve archives from the WordPress norm previously, and what I’m about to explain builds on that. You may also want to find out how to show your archives page in WordPress, if you’re not certain of that process.

How it’s better

The Frozen Toothpaste archive began with the same archives.php file that is included in my themes (that’s the one with Justin Blanton’s Smart Archives plugin built in). I added three aspects, however, all of which are significant improvements on that version. Because they’re still far from the norm in WordPress themes, I’ve decided I don’t want to natively include them in my themes, but I do want to make them easy to implement. That’s why you’ll find a link at the bottom of this article to the full archives.php I’m using at Frozen Toothpaste. This should easily drop into place in ANY WordPress theme and installation, though it may look a little wonky without the necessary styles.

Okay, lets discuss the three big improvements. The first is that there are words on the Archives page. This shouldn’t be half as novel as it is. It’s also notable that in those words are links to each section of what can be a very long archives page.

Secondly, there is a recommendations section. This is a very useful feature because, well, no one’s likely to read everything you’ve ever written to find the best stuff. The recommendations sections is great way for visitors to see some your best stuff and easily find out if they like what you’re doing.

The final feature is the tag cloud. Since WordPress 2.3 was released, making a tag cloud has been easy. The issue is that for established blogs with lots of back content, getting all of that tagged is problematic. Also, because many people are still running WP2.2 and earlier, I’ve decided to leave any tag data out of my canonical theme work.

How I did it

Now to the implementation. Both the “text” and recommendations section are enabled by the same basic features that all other archives.php seem to lack (for reasons I don’t understand). Essentially, most archive pages omit The Loop, which tells WordPess to get the words entered into the “Post” section for your archives page (as it does for every other page.) To correct this problem takes only a few simple lines:

<?php if (have_posts()) : while (have_posts()) : the_post(); ?>
<div class="archivetext">
<?php the_content(); ?>
</div>
<?php endwhile; endif; ?>

These lines are essentially the basic loop that makes WordPress run. The first line tells WordPress to proceed if there’s text to display, the third line spits out the text, and the fifth tells the processor to proceed if there was nothing to display. (Lines two and four are merely to make it easy to style the text that WordPress has spit out.)

With this code included in your archives.php file, any text you enter into WordPress (as you normally would) will be displayed. This allows you to easily create and edit your recommendations section, because it’s as easy to get to as a normal page in WordPress. This also allows you to create links your category section, for example, by simply including a link to “#category.”

Finally, the tag cloud. As I said, this is scandalously easy to do in 2.3 and above. All you need are these two lines:

<h3><a name="tags"></a>By tags:</h3>
<?php wp_tag_cloud('smallest=10&largest=28&number=30'); ?>

Here the first line merely gives us a title for the section, including the syntax so you can link to the section with a simple “#tags” link. The second line leverages WordPress’s wp_tag_cloud command to create the cloud. It also includes instructions that the smallest output should be 10 pixels tall, the largest should be 28, and that we only want it to show the 30 most common tags. All of those values can be changed to anything you want. (There are also other variables for this command, which you can find in the WordPress Codex.)

Give it to me

There it is: all the instructions you need to improve any archives.php page. And now, the whole page, as promised, for you to drop into any theme you think could benefit from a better archive. Download it! (The file you’re downloading is archives.phps, you’ll want to rename it archives.php before you try to use it.) Happy blogging!

I was working on another post (here’s the first) about improving your WordPress Archives pages when I realized that some may not even know how to show the one they already have. If that’s your situation, fear not: it’s very easy, and I’ve got pictures.

Essentially, to get the archives(.php) page included in the theme you’re using to display, you have to create a page with the Archives template applied to it. If that’s sufficient for you to do it, feel free to stop reading. If you’re still a little confused, read on.

Since I also don’t have an archives page (as of this writing), you can follow along as I create one.

First, from the dashboard, click on “Write.”

Then, click “Write Page.”

Title the page, I chose the bland but useful “Archives.” In almost all cases this will only by used to determine the the text that links to the page. It’s rare (but not impossible) for the archives page to reflect the title you gave it.

Locate and enlarge the “Page Template” box in the right sidebar.

Change the page template, to “Archives” it should be there for most themes. If it’s not you’ll either need to put a new archives.php into the theme’s folder, or use a new theme. But we’ll move on like you’ve found it.

Press “Publish,” and bask in the glow of work well done. See my result here.

If there’s one big problem with WordPress (and blogs in general) it’s that posts come and go very quickly. This is great for people who are embarrassed by what they’re writing, but for the average person this can be a great disappointment.

It also doesn’t help the case that WordPress’s default Archives page is ugly and hard to use. Nor that most free themes that contain an Archives page aren’t much better.

Since you may be a little confused, dear reader, some visuals. The default WordPress archives page (that’s archives.php for those keeping score at home) is pictured at right (click for bigger).

Anyone who’s ever used it will know that they’re taken from the monthly link to pages that simply show all entries from that month in full form (this time we’re talking about archive.php sportsfans). The format and contents of those pages doesn’t concern us now, as it’s a long-standing — even if unwise — tradition that clicking “February 2007” on the blog of anyone mildly prolific is a dangerous idea.

If you look very hard at improving the Archives page in WordPress, you’ll quickly come to understand why they tend to be so sub-par. WordPress’s native function to create archives (wp_get_archives) is frighteningly limited in it’s abilities. I’ll spare you the details, but suffice it to say that nothing it outputs is much better than what we’ve seen.

Since WordPress itself fails, a different application is needed. Having already found Justin Blanton’s Smart Archives plugin — which I used to make my archives at Frozen Toothpaste more presentable — I decided that was a good place to start.

As the Frozen Toothpaste archive shows (see left), the Smart Archive plugin allows you to cleanly display all the your writings from a given month listed chronologically. This, I decided, was the Archives page I wanted my themes to have.

But requiring plugins for a theme to work is fraught with problems. It requires more work than the average WordPress user can or wants to commit to. So however I made my archive, it had to be inside the theme. The easiest way to do that: include the plugin on the page that creates the archives — archives.php.

Though I’m neither a PHP or server-load “pro,” I couldn’t find much of a downside to to putting the code from the plug-in on the page (if you are such a person and can tell me that there is a problem, please do). And, better still, doing so would make the creation of a nice monthly archive as easy as the creation of a default poor one.

So essentially, that’s what I did. I did do a great deal of shrinking and modifying of Mr. Blanton’s plugin, but it meat of it is still intact. Most of my cuts were becuase I required it to do far less than the plugin can. I wanted the code as lean as it could be while still providing the necessary function, which I think it does. To see my archives.php page it in action, just head over to the Ikiru Demo Blog and look at it on any of my themes. (You can also see the Archives page on WordPress’s default theme for comparison.)

And if you’re looking for something even more fancy than the Archives pages provided by Smart Archives (in or outside of) my themes, I’d suggest that the best place to look is Clean Archives which is both flashier and larger than the Smart Archives plug-in. Though these characteristic were detrimental to my need here, they may be exactly what you’re looking for.