Ikiru Design

Over the weekend, I decided to finally install a copy of the WordPress trunk — that’s the currently-being-worked-on version for those not familiar with the term. For need of something to write on that new installation, I noted my first impressions of it. It seems relevant to share as the WordPress team is now soliciting advice about its menu structures.

It worth noting that I did this Saturday. Things have changed since. If you’re interested, popularly relevant information about development is at the WordPress Blog. More abbreviated notes, and up-to-the-day changes are tracked here.

Because some of my impressions make little sense without visuals, I’ve included a gallery of the most notable changes that have so far been made in the progress toward 2.7. (Sidenote: first time I’ve used the gallery in WordPress.)

And now my impressions, as originally noted:

I don’t really like how the new version smashes out the horizontal space. Though I doubt the change is nearly as big as it currently seems to me, it’s undeniable that the compose area fits fewer words per line than did previous (2.6-) versions.

The left side navigation has its pluses and minuses. I like that you can get to any page at all from it, but it’s also there even when you aren’t wanting to go to any page.

I think the term Utilities in the sidebar is misguided. “Manage” seemed to make more sense, and still does.

The built-in browse and install feature for plugins is pretty unquestionably cool.

The built-in upgrade to WordPress itself seemed to have failed on my one and only attempt. (It has since worked for me, the failure may have been a fluke.)

I think the ability to drag anything on the write page the sidebar is good, but it’s not as much customizability as I’d like. Will I ever be able to put a custom field on a post, without having to name that field every time? And be able to put that field right under the title field if I so choose? Until then any changes or not to the Write page will seem rather superficial to me.

There appears to have been few or no changes made to the Themes area thus far.

The dashboard has changed, but right now the utility of the “Inbox” and Quick Post sections, both sitting above the news boxes of 2.5+, are open questions.

Clearly there’s no small amount of work left before 2.7 “ships” in November (by current plans). That said, I’m amazed by all the great features slated for inclusion, and I feel so lucky to blog on such a constantly-improving platform.

I think the quip, which I most often see attributed to Thomas Fuller, that “All things are difficult before they are easy” is so clearly borne out by debugging that the truth of it cannot be doubted. You can easily spend minutes, hours, even days bashing your head against a metaphorical wall only to notice that a misplaced colon — which you of course, didn’t realize was misplaced — was the cause of reams of unnecessary pain.

The Problem: Incompatible Rules

During my work on Kaleidoscope, that’s the theme this site is running, I decided that a random post link in the footer would be nice. A quick search yeilded Matt’s Random Redirect Plugin, which was more than up to the job. Without a need to reinvent the wheel, I just borrowed the core functionality of Matt’s plugin function and dropped it into my theme’s functions.php file.

And on my personal test server, it worked well. And when I put it on the Ikiru Demo Blog, there too it worked fine. But I found problems on Ikiru Design. More frustratingly, those problems would sometimes seem to suddenly disappear. (It was only later that I realized that it was whether or not I’d logged in that was the cause of that disparity.)

As you may suspect from what I’ve said so far, Ikiru Design has the WP Super Cache plugin running (though it has rarely needed it). Looking desperately to figure out why my redirect link in the footer worked on the demo blog but not on the main one, I decided to look through their directories.

Solution One: Changing .htaccess

Mercifully, I noticed that the .htaccess files were drastically different sizes. And I remembered that SuperCache depends on your making changes to that file. And indeed, comparing the two showed these lines added to Ikiru’s .htaccess file:

# BEGIN WPSuperCache

<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteCond %{QUERY_STRING} !.*s=.*
RewriteCond %{HTTP_COOKIE} !^.*(comment_author_|wordpress|wp-postpass_).*$
RewriteCond %{HTTP:Accept-Encoding} gzip
RewriteCond %{DOCUMENT_ROOT}/wp-content/cache/supercache/%{HTTP_HOST}/$1/index.html.gz -f
RewriteRule ^(.*) /wp-content/cache/supercache/%{HTTP_HOST}/$1/index.html.gz [L]

RewriteCond %{QUERY_STRING} !.*s=.*
RewriteCond %{HTTP_COOKIE} !^.*(comment_author_|wordpress|wp-postpass_).*$
RewriteCond %{DOCUMENT_ROOT}/wp-content/cache/supercache/%{HTTP_HOST}/$1/index.html -f
RewriteRule ^(.*) /wp-content/cache/supercache/%{HTTP_HOST}/$1/index.html [L]
</IfModule>

# END WPSuperCache

I now understand what this does, but at first I didn’t. It looked like a mash of random characters. But I know enough about programming conventions to guess that an “!” means not. And I also know enough about this modern world to know to Google things I don’t understand. “RewriteRule” seemed a reasonable phrase to start with.

I’ll spare you the full narrative of the search, but I’ll explain what I learned. RewriteCond provides the conditions that determine whether or not a RewriteRule is used by the server. Essentially, if a user trying to access a given file on the server gets through all the conditions in the RewriteCond stack, they’ll be made to follow the RewriteRule.

In this case, that means that if their query string — that’s the ?s or ?p=187 or ?random that tells the server what dynamic features are wanted — doesn’t start with ?s, and if the user doesn’t have a cookie specifying that they’ve either logged in or commented, and if the proper static file has been generated, send them that static file. (You see essentially the same rules there twice, the top one is for if you’re using compression, the other for if you’re not.) This is exactly how Super Cache is advertised to work.

But it means that the server will ignore the query string ?random that Matt’s Random Redirect function relies on. So the user will get, as I was, the cached version of the index page. And they’ll get it before Matt’s plugin has had a chance to well, redirect them.

Having figured that this was what was probably happening, I felt reasonably hopeful that I could finally fix this week-old problem. After all, the random link was working when I was logged in — thus not making me follow the RewriteRule — but it was failing when I wasn’t.

So I added was this line to the RewriteCond stacks:

RewriteCond %{QUERY_STRING} !.*random*

This adds an exclusion, which says that if the url looks something like “http://www.ikirudesign.com/?random”, exclude the user from the RewriteRule. Uploading the modified file and opening the link from every conceivable page I could find showed that it was finally working.

Solution Two: Changing the Function

But this can’t be packaged into a theme. Fortunately, a usable but imperfect solution can be. The basic problem is that redirects break with WP Super Cache. The solution is to do this same thing without a redirect.

Essentially, all this take is simplifying Matt’s Random Redirect Plugin even further. The result was this function:

function sc_safe_random() {
	global $wpdb;
	$query = "SELECT ID FROM $wpdb->posts WHERE post_type = 'post' AND post_password = '' AND post_status = 'publish' ORDER BY RAND() LIMIT 1";
	$random_id = $wpdb->get_var( $query );
	return get_permalink($random_id);
}

This is essentially the first three lines of Matt’s function — which picks a random post from among those eligible on your blog — and adds a line that just tells it to pass the permalink for that post to the place where the function is called. Then you simply call the function for your random link, like:

<a href="<?php echo sc_safe_random() ?>">a random post</a>

This solution works, but it’s got a problem. If I were to click the redirect version into five new tabs from a single page, I’d receive five tabs each with a different random post in it. If I do the same with this version, I get the same post each time.

The likelihood of someone doing this is obviously questionable, but it’s a feature that I’d rather not lose. For that reason, I’m planning on making sure that I allow a user who doesn’t have WP Super Cache enabled, or who have implemented Solution One, to use the redirect version. Those who have Super Cache enabled, or who don’t mind the limitations of this second solution, would be able to continue to use it.

I have mixed feelings about posting whenever a single theme is updated, but this is a pretty big one. And it’s also worth noting that the WordPress Themes Directory got it up less than 24 hours after I uploaded it. Given the large lead time that was needed for 0.7.6, I was pleasantly surprised to see that. So anyway, the most important changes are, in a particular order:

1. The theme now has an options page. Controllable are the accent color — at Ikiru Design that’s set to “orange” — which is used one the description in the header and the links in the footer, the display of default gravatars, the display of The Mini Quilt (see #2), and switching to Southern Hemisphere colors.
2. The Mini Quilt. The Mini Quilt is a smaller version of the Quilt that appears on Kaleidoscope archives pages. To fit, it sacrifices displaying the Post Titles — though you’ll see them on hover — in favor of offering many more posts than a basic Recent Posts widget would. (And if you want to display both, or have even more control of your sidebar, the quilt will also appear as a potential sidebar widget.)
3. The random post link in the footer is now compatible with WP Super Cache. Because the popular plugin changes a blog’s redirect rules, the old method — which required a redirect — would break when you ran the plugin. The new method, which gets rid of the need for a redirect, will help keep your server load down, and will let readers use the link whether you’re caching or note. (Also, I’m working on a post explaining two different workarounds for the problem.)
4. Fixed a number of visual “bugs”. Two different problems caused the layout of certain pages to break in 0.7.6, with the help of Babs, those are fixed. A number of little problems have been tackled.
5. Finally, and this may have been unnoticed by everyone but me, in previous version of Kaleidoscope (and every theme I’ve made for that matter) the search bar has been outside of the area in the sidebar that is replaced by widget. That is because I didn’t like the styling of the widget. But now I’ve overridden the styling of the widget, and am satisfied with it. Essentially, you finally have the freedom to put the search box where ever you want it in the sidebar.

These are some of things I’d been planning to do on Kaleidoscope and I’m glad to have finally gotten them out. I’m sure there are still problems lurking under the surface, and I’m sure a quick-eyed user will find them quicker than I. If you’re such a user, please drop me a line.

Oh, the download link! And here’s a link to Kaleidoscope’s listing in the WordPress Themes Directory.

I’ve been working, on and off for a while, on a theme that translates the date of a post — or in the case of multiple, the topmost — into a color and uses that to determine the color of the page. This was inspired in no small part by the now-retired look that Shaun Inman used to use.

I honestly don’t remember when I started working on it, but I wouldn’t be surprised to find out it began in January. That isn’t to say that development of this theme has been terribly difficult — though there were certainly parts I’ve struggled with — but also that I’ve simply been short on time I’ve been able to devote to the project.

It wasn’t until Friday, after what felt like a too-long wait, that I finally saw the then-current version, 0.7.6 in the newly opened WordPress Theme Directory. This release, as signified by it’s less than 1.0 status, is less than I intend to do with the theme. But I’m hoping that finally making the project public will force me to spend more time to add the last features that I’ve been waiting so long to build.

Enough about how my development process works however, let’s cover the highlights of the theme itself. The primary feature, the one for which it is named, is the algorithm that translates dates into colors. This is done with a few PHP functions which take advantage of cosine curves to generate colors that are generally suited to the time of year. Essentially, the three colors of the red-green-blue system commonly used in HTML, all peak at different times. The blue is at it’s height around January first, green peaks around April 1, and red peaks around September 1. All of these are estimates, as I’ve fudged a bit with the peaks and valleys of these curves to give me colors closer to what I want.

Taking advantage of this date-to-color algorithm, I’ve made my favorite feature, the quilt. The quilt is, as you may guess, a collection of differently colored squares to create a blanket to keep you warm… err, display your posts. Rather than use the month-divided list-style archives I’ve built for my themes in the past, I’ve made a single collection of all posts, with colors serving to give you a rough idea of the date. You can easily tell posts from January from those from August, and you can also tell posts from 2008 are different from those from 2005. Of course, this feature is also made even easier to understand by the fact that the post are themselves shown chronologically in the quilt. The real result of the quilt, however, is that you get a beautiful rendering of your archives.

There are many more little features in this theme. I’ve added a rather novel system to hide the default gravatars when a user hasn’t set them. Trackback are seperated from comments so they don’t break the flow of conversation. The whole archives page is prettier than any I’ve made. Heck, the theme itself is just prettier than any I’ve made. And page titles have a novel organization I’m rather fond of.

Mostly though, I’m glad to have finally put this out into the world. It’s still not done, but I simply can’t continue to sit on it. I’ll keep you updated about changes I make to it in the future, and I hope to write a few tutorials explaining the most interesting features of Kaleidoscope to anyone interesting in using them in a different context.

You can, of course, see a demo of the theme at the Ikiru Demo Blog. Be sure to look at the archives page. (Or you can just look around here, as it is the theme Ikiru Design is currently using.) There is also a demo, lacking an archives page, at the WordPress Theme Directory. And you can download the theme from there. You can find even more rambling about it at the theme’s page. And if you have anything to tell me about it — be it bug reports, complaints, or compliments — feel free to contact me.