Creating my own WordPress theme, but not from scratch

Pinterest

I’ve just finished initial work on turning an open source web design into a WordPress theme. I had set out last week to attempt creating my own WordPress theme and offer it for download to anyone who might be interested in using it.

I browsed through the designs submitted to the Open Source Web Design site for inspiration and when I found Plain 1.0, done by James Koster, I decided to just use it and port it to WordPress. Plain 1.0 is a great-looking minimalist design that makes use of a lot of white space. It was XHTML compliant before I started working on it.

I’m no geek but that’s what’s great about open source, you can build on what others are doing. I found turning a ready-made design into a WordPress theme surprisingly easy, with the help of the extensive documentation in the WordPress codex. I also went through some of the open source WordPress themes I loved and used pieces of code from it for the design.

For instance, I used K2‘s code used to generate the web pages’ title because it places the blog article’s title before the site name, which is good for search engines ranking. I also used K2’s archives page for this theme’s archives. This means the theme has built-in support for Extended Live Archives as well as ready-to-deploy Ultimate Tag Warrior tag cloud archive. I still have to look into the CSS for Extended Live Archives as the default one looks ugly in the theme.

I also included into the template, links for saving the articles into Del.icio.us, YahooMyWeb, Spurl and Furl. While this can be done through WordPress plugins, I think doing it through the template files is better.

The theme has built-in support for Gravatars, Related Posts (but I’m thinking of using Related Entries 2.0 instead) and Ultimate Tag Warrior. Im still trying to implement Matts Asides and segregate it from regular posts so that you can style your asides separately and even present a different ad format for asides and regular posts. I will go over K2’s theloop.php file and study whether I can rip it apart and use it for the theme.

I’m also still trying to integrate FAlbum, a plugin that integrates your Flickr photos into your WordPress site. If I am able to successfully do that, the theme will have built-in support for FAlbum.

The theme will have built-in support for displaying Google AdSense or any other ad only in the first post in the index page, floating within the content area. Google AdSenses heatmap says this is the optimal position.

I’ll zip the files up as soon as I clean it up and after this month ends since I already have a bandwidth warning from my web host. There are still orphan files like theloop.php. I wanted to follow K2 and have the WordPress loop in a single file for easy editing but I’m a moron when it comes to formulating conditional statements and I couldn’t make the loop behave differently for single pages and the main index. For instance, I wanted the social bookmarks link to appear only in single posts but since I wasn’t able to do this with a conditional statement in the loop, I just ripped it apart and placed the loop in single.php.

I’ll offer the files for download over the weekend, including the PSD of my sketch you see up there in the main page so that you can easily replace it with your photo. I used one of the Photoshop tutorials on how to render a scotch tape for it.

I’m still tweaking the theme, any suggestions? Would you be interested in using it?

Pinterest
Loading Facebook Comments ...

9 Comments

  1. Nice work, i’ve done the same with one of the dreamweaver templates, i’ve changed it a bit and removed some but it’s really a port for wordpress, see what you think!

  2. MENJ,
    Yes, I’ve been distracted by a few pressing tasks but I’ve already done the theme. It’s just a matter of cleaning it up and packaging it for download.
    Max

  3. […] For a long time, I just used WordPress’ stock comments template but at the back of my mind, I had listed the segregation of trackbacks and comments as something that I would be implementing in this blog and the theme that I’m finalizing. Last week, however, my post on using Dreamweaver to modify a WordPress theme got a lot of trackbacks and I saw the need to separate these notifications from regular comments on the post. […]

  4. Thanks. I enjoyed this article. Would you consider sharing how you integrated FAlbum to your theme in another article?

Leave a Reply

Your email address will not be published. Required fields are marked *

No Trackbacks.