In fact, we enjoyed the process of creating this theme so much that we plan on doing it again. From time to time, we’ll post a free WordPress theme on our blog for you to download and enjoy. Check back soon or subscribe to the feed so you don’t miss out.

Features

This theme is essentially a re-purposed and enhanced version of our old blog theme. It won’t make you coffee, but it will make your blog look good.

• Widget ready
• Supports threaded comments
• sIFR enhanced (minimal configuration)
• Random, rotating banner images
• One-click social bookmarking
• Segregated search results (pages styled differently than posts)
• Localization support (interested translators please leave a comment below)
• Support for WordPress’ Custom Header API

Testing and validation

• Tested W3C valid (XHTML 1.0 transitional and CSS 3)
• Tested in Firefox 3, Safari 4, Internet Explorer 7 & 8, and Chrome
• Tested at resolutions from 1024 x 768 to 1680 x 1050

Requirements

• WordPress 2.7 or higher

Download or try the demo

Grab the zip file below (658 kb) or try out the fully functional demo first.

I’ve included documentation in the zip file that explains how to install and customize the theme; however, feel free to post a comment if you get stuck (or if you find a bug).

Alternate versions

sIFR support also requires some extra work, and we like to keep things simple. If you just aren’t interested in using sIFR on your blog, you can grab the latest version without sIFR support.

Download version 2.3 (no sIFR) (509 kb)

As of 2.2, we decided to drop support for Internet Explorer 6. To keep our theme accessible to users of IE6, we’ve kept the older 2.1 version available. This version has been fully tested in that browser and works fine.

Download version 2.1 beta (1.74 MB)

Legal

The Elegante WordPress theme is licensed under the GNU General Public License version 3. In plain terms, this means you are free to download, modify, and use the theme for commercial or personal purposes, provided that you keep the footer link, which reads “Elegante website theme by 3 Roads”, intact and unchanged.

Change Log

2.3 (23 December 2009)

• Added localization support
• Completely widgetized the sidebar
• Added support for WordPress custom header API
• Added support for SEO custom fields
• Changed to a GPL compatible license

2.2 (30 October 2009)

• Added support for child and grandchild pages
• Added support for sIFR dropdown menus (when child pages are present)
• Added new styles for HTML embedded in comments
• Added new styles for HTML tables
• Enabled comments for pages
• Improved image styling (large images no longer break layout)
• Comments and trackbacks now display separately
• Dropped support for IE6

2.1 Beta (1 October 2009)

• Added sIFR support for special characters
• Actually included the sIFR Flash files this time…
• Updated documentation on how to configure sIFR

2.0 Beta (16 September 2009)

• Initial public release

When viewing the latest post, next_post_link() displays nothing; when viewing the earliest post, previous_post_link() displays nothing. This can result in some less than friendly navigation.

In this post, I’ll show you how to use a built-in WordPress function and PHP conditionals to improve your WordPress page navigation.

The problem

Here is an example of next_post_link() and previous_post_link() at work on our blog’s old theme:

When viewing a post that is neither the newest nor the oldest, the post navigation links display as expected.

The trouble with these functions comes when you get to the first or last post. In the case of the first, you’ll have something like this:

When viewing the oldest post, the "previous post" link disappears, leaving an ugly hole.

And when viewing the last post, you’ll have something like this:

Similarly, when viewing the newest post, the "next post" link disappears.

To the rescue: get_adjacent_post

We’re going to use the obscure WordPress function get_adjacent_post() to check if… (shockingly) …there is an adjacent post. If there isn’t, we output whatever HTML markup we like to take the place of the gaping hole we’re trying to fill. If there is an adjacent post, we output it as normal.

The function retrieves a link to the adjacent post (either next or previous) and takes the following form…

get_adjacent_post([bool $in_same_cat, string $excluded_categories, bool $previous])

…and has these parameters:

• $in_same_cat : Whether the link should be in the same category
• $excluded_categories : A comma-separated list of excluded category IDs
• $previous : Whether to retrieve the previous post

The solution, with sample markup

The code block below contains the markup you should add to your single.php template file. Place it where you’d like your navigation to appear, then adjust the parameters and output to suit your needs.

<span id="prev">
   <?php previous_post_link('%link', '&laquo; Previous'); ?>
   <?php if(!get_adjacent_post(false, '', true)) { echo '<span>&laquo;Previous</span>'; } // if there are no older articles ?>
</span>
<span id="next">
   <?php next_post_link('%link', 'Next &raquo;'); ?>
   <?php if(!get_adjacent_post(false, '', false)) { echo '<span>Next &raquo;</span>'; } // if there are no newer articles ?>
</span>

I then added this line to my CSS file:

#prev span, #next span { color:#ccc; } /* lighter than the normal anchor text */

And here is the final result:

The final result, showing user-friendly language at both ends.

In the example above, I grayed out the inactive links. If you have more room, you might get creative by replacing the text with something like “Sorry, there aren’t any newer posts!”