After upgrading to WordPress 2.5.x, I had to fall back on a stock theme because my old customization of the Sandbox theme no longer worked with the upgrade. But, then, it was time to redo my theme anyway. So here you’re looking at the first version of my new theme. I might have let it stabilize some more before putting it on-line, but who cares? My reader maybe? Let’s just hope he or she doesn’t use IE. 😉
Vertical navigation
Ever since the first time that I saw a blog which featured vertical navigation instead of the typical columns, I’ve wanted to implement this for myself. Well, finally…
Site-wide elements use the complete width of the page. The page content is centered in the middle at 87.5%. The identity stuff in the header and the navigation in the footer sits against a back blackground while the content area has the proven black on white for easy reading. I hope that the strong color-contrast as well as the clear difference in with between site-wide elements and page content makes it easy to keep focused on either reading or navigating without distractions.
… and a talkative footer
With this theme, I didn’t want another footer which consist of the odd logo and some loose copyright statements. I wanted a footer which you can actually read, even understand. And who cares if it takes up a little space? It’s at the bottom of the page.
Related posts
I’ve written an (unpublished, unpolished) plug-in which can generate a list of posts that are chronologically related. Traditionally, most blogs have a next/previous post link at the top and bottom of each post. This works very well if you limit your blog to one subject (which is really a very good idea anyway), but if, like mine, your blog is a little bit messy, you could say that someone who stumbled here searching for an article about Subversion is not necessarily interested in the next post if this is a photo of my baby niece.
Hence the chronologically related posts plugin. With this plugin I can say wether I want a link to the first, previous and next post in the blog, within the same category, or matching a given number of tags. (The tag matching isn’t implemented yet, though. Also, matching on meta fields would be a kick-ass ass way to support explicit sequences.)
I put the list generated by this plug-in on top of a blue background besides the various context links of the post.
Issues left
I hope to have the first major revision of my theme ready soon. Here’s a list of some issues that I might address:
- The CSS renders a bit psychedelically in MSIE 6 (only version I tested) at the moment. Sigh… Let’s just hope that IE 7 will give better results. Then I’ll gladly drop the IE 6 support.
- When viewing a category, the tag cloud in the navigation panel at the bottom only shows tags for that category. This has to do with the use with me calling the st_tag_cloud() from within the category template.
- Some of the elements that I just showed to you don’t really look that good and most elements that I didn’t can be said to be … hideously ugly. 😕 Some highlights: the header (should really be a few cool images), the comment form, and the Next/Previous Page links.
Comment!
I’d almost forget all about the clean, new look of the comment list. And, if you register a Gravatar, your comments will be accompanied by your avatar. Try it. Please!
Been productive haven’t you :)? It’s working out well, your theme development.
It even renders correctly on my crap 1024×768 monitor. But when the content is 87.5% wide, doesn’t that make the text rather difficult to follow if you have a high horizontal resolution? I fixed my website at 700px for that reason. I know, one can resize the window, but I haven’t decided if that’s something you should lay on your readers.
The dark-gray header with the avatar at the top of the post, isn’t that a bit too much empty space? Perhaps you can put some information about the author in there?
Hey, I just noticed there is a small gray bar next to my avatar. Is that on purpose?
I should really be sleeping, but here’s to transparency. 😉 The small gray border to the right of the comment avatars is on purpose. Is it too ugly? What do you think?
Maybe I should add a max-width to the content area. But, I’d rather set it to a number of character (ex units) rather than pixels.
I can’t imagine that you mean that the avatar leaves a lot of empty space (as it floats in the text), so you probably mean the little, rounded (empty) gray bar below the avatar. Is that right? If that’s so … I’m not sure. I kind of like the uselessness of it. Also, I like empty space. But do give me your thoughts if only to think about.
Do you also find it a lot more difficult to describe visual elements than to describe code? 😛
By the way, it’s a sin that you have to fall-back to such a crap CRT and it’s good thing that you’ve brought the real deal to Germany for repair. I hope for you that you’ll have it back soon. Yeah, you guys—should I even address our readership in plural?—according to this dude here, CRTs are where it’s at and where it’s always been! Maybe he’ll blog about it one day. Or maybe his feelings on this subject are strong enough to justify a proper article? We’ll see.
I think the small gray border will look better if minheight=max(avatarheight,commentblock-height).
Looking at your screenshots, there is some freaky shit going on with the avatar. I can’t seem to attach things to this post, so observe the result externally.
Funny, I just noticed Konquerer does render it properly.
And about my dear old (well, “old”…) CRT. I hope the new tube will be as good as the old one, because I have seen other Eizo T766’s which weren’t up to my demands…
And I indeed may just write an article about it. TFT’s suck…
Ah. Of course! I should have tested on an older Firefox. I’m on version 3 these days. It’s a lucky thing that you’re still on FF 2.
I’ve made the Avatar’s containing div 96 pixels wide explicitly now. Here’s to hoping that the ugliness is fixed now. I was wondering what you were on about with the remark about the avatar taking up a lot of space… Now I understand. 😕
How did you do that before? I’d like to know what behavior it was that borked FF2.
Because I floated the div, it just assumed the size of the contained img. I think that according to spec the float suspended the default 100% width of the div. (I haven’t checked this with the spec, though.)