Sunrise, sunset

Sunrise, sunset

Although this theme may have been re-written from the ground up leaving few remnants of the “zipper” theme that I’ve been running for the last 7 months (its had a few touch-ups during that time), I’m not thinking of this as a complete redesign, its more of a refinement or evolution with some tricks thrown in. And hopefully its going to be a bit quicker too, since I’ve spent a fair amount of time cleaning things up to try and reduce load times.

Keep reading to find out how and why I made some of the bigger changes, as well as a few things that I still haven’t completely finished. I might even let you know about some other things I’m working on

The Sidebar

While my previous design was reasonably clean, it was beginning to look a bit cluttered, in particular the sidebar. I wasn’t so worried about it on the homepage, but on the individual posts it wasn’t great, and on pages the majority of the info was completely irrelevant and useless.

So I looked at each thing in the sidebar, and immediately dropped the calendar. All it was doing was showing that I hadn’t posted anything for 3 weeks, basically it was just taking up space. With that done I decide I’d move the archives, categories and blogroll back down to the bottom of the page where they had been on pipeDream.

I knew what I wanted the archives section to look like, I’ve liked Shaun Inman’s approach since I first saw it, but at that point I only had about 6 months of posts so it wouldn’t have really worked. I then had to work out how to do it. Not knowing how Shaun achieved it, but since I couldn’t really get the default WordPress functions to do it, I’m guessing he probably did the same thing I did and wrote a custom function to handle it.

When it came to the individual posts view, I was a bit over the icons that I’d been using since the Redoable days, so I switched them out for text labels. I also dropped all the crap that was in the sidebar that didn’t need to be there on single posts. Pages by default still have a sidebar, but many (archives, downloads, reviews, projects) now use the full width the present their content. More about those pages later.

The Posts

Considering a blog is mostly about its content this the part that probably changed the least. Min change is the switch back to Helvetica Neue/Helvetica for all text, and I played with the colours a bit. I also made the comments link a little ‘bubble’ showing the number of comments. The only other noticeable change is that links within posts are highlighted to make them standout a little better.

The Comments

Although I liked my previous comments layout, I want to make better use of the available space and try something a little different. I made the comments list stretch full width, and moved the commenter’s details to the right hand side, so that the main focus was their comment. The new layout also uses less vertical space, which is good one some of the pages that I’ve got with hundred of comments. For something different, and so users don’t have to scroll past 50 comments to make their own, I also moved the new comment box so that it sits above the comment list. I’ve also reversed the order of the comments so the most recent is at the top.

The Archives

I was running a “custom” archive previously, but it was slapped together quickly and I knew it wasn’t particular efficient. I didn’t know that because of its inefficiency that it was actually missing posts from the list. So I rewrote it from scratch it now only uses a couple of queries instead of … umm … lots, lists all my posts and looks better too.

The Downloads

I like what I’ve done with the downloads page, theres a few neat tricks which add some ‘interest’ to it. Firstly, it shows off just how many times you nice people have downloaded things like Fluency and Redoable, and with a little php “magic” it even graphs for each download to compare the popularity of versions etc. Its also set up so that although all downloads are listed and available, on the most recent version of each ‘product’ is highlighted.

The Reviews

As it always has been the reviews page is powered by Paul Gosicki’s Movie Ratings plugin. But I’ve made numerous changes to it for my own needs, including new star images to match the new design, and added a new function that handles what is actually displayed on the reviews page. I was on an optimisation march and it got in the way, so I cleaned up the number of sql queries it was making, and removed the need for it to load any javascript libraries (which I wasn’t using). I also changed to show movies based on when I watched/rated them by default, instead of alphabetically.

The Projects

Again I haven’t quite finished this page, still have to find some time to do some pretty images for the rest of my plugins and themes that are listed. And for some reason there is an odd white gap above the header, and it only appears on this page, I’m not sure whats causing it either.

The Header

This is definitely my favourite bit. This was actually the fourth or fifth completely different header style I tried while working on this refresh, and I’m glad I tried it and that it worked. Its made up of a bunch of layers, sky, sun, moon, stars and clouds, and depending on what time of day you visit its going to look different. It changes every 30 minutes to be precise. The times are based on MY timezone, so the whole day/night thing is probably going to be a bit backwards for most people, if I find a nice way to fix that I will. You should also keep an eye on the sky… you never know what might appear, or when…

The Lifestream

The return of Captain Planet, bigger and better. Ok so the super rushed dev of the first iteration didn’t go so well. This one should be better with a bit of luck. In the backend its more flexible, allowing you to add whatever feeds you want, its working wonderfully with any feed from Feedburner, but I’m yet to give it a real workout with raw feeds directly from flickr/delicious/twitter etc, but I see no reason why it shouldn’t continue to work.

I’ve also cleaned up the admin (which none of you had seen anyway), and added a few ‘helper’ functions (with more to come). For example, the latest tweet show at the top of each page, and the recent flickr images on the homepage are both generated out of Captain Planet, no more waiting for external javascript on each load.

I’ve already had a couple of request from people who’d like to test it, which is great, and once I’ve gotten to a point what I’m happy for that to happen I let them in on the fun.

And that’s about it, if you’re still reading congrats I know you’re probably bored by now. That’ll do me, I’m going to see if I can see someone other than Michael Phelps win gold at the Olympics.

Please leave your name and email, so we can show off your gravatar


3 Comments on this

  1. Nice work indeed. Clean and pleasant to read. Really like the archives and download archives layout. Was that difficult to achieve?

  2. Great job. Looking forward to your next downloadable theme~

  3. This is awesome Dean, and the header is my favorite bit as well.
    You continue to amaze me.……

twitter was not updated. | lastfm was not updated. |