Website Design Articles

Converting a HTML Template to a WordPress Theme

If you've ever wanted to create a custom theme or template for your WordPress blog, here are some tips and links to other sites that can give you a running start.

There are a ton of free WordPress templates available, but what if you find a commercial or opensource website template that isn't available as a WordPress template?  You options are to either hire someone to do it for you, or pull up your sleeves and do it yourself.  I tore into a couple of WordPress templates to find out the easiest way to build one, and here's my synopsis.

I'm a Dreamweaver buff, and just about everything I do design-wise is linked to DW somehow.  Whether it's altering my current WebRehash.com template or just FTPing files to a server, I use Dreamweaver for the bulk of the work.  When it comes to WordPress templates, Dreamweaver is still just as useful as any other task.  The trick is to get a usable file that you can make your changes to.

There are several good tutorials on how to create WordPress templates over at Max Limpag's blog where he uses Dreamweaver to slice and dice together a WP template.  He goes into good detail about how to reconstruct a WP template into a single Dreamweaver file that can then be changed to your liking.  Then it's just a matter of recreating the WP files with your new template code.  That's a whole process in itself however.  Some of the comments demonstrate different ways of getting a Dreamweaver-friendly page to work with, and the one I prefer is just previewing your template and either copying and pasting the code into a new DW document or saving the page as a file and then opening it in DW.  That saves the step of having to piecemeal the code together within DW to get a usable file.

Max has another article, How to convert any web template into a WordPress theme, that goes into excellent detail for converting existing HTML templates to a WordPress template.  Another very good tutorial on creating a custom WP theme is at Jonathan Wold's website titled Wordpress Tutorial: How to Create a Wordpress Theme.  This tutorial delves into the WP code and explains step-by-step how to create your own template.  This is a great guide if you are trying to build a blog that mirrors an existing website look and feel.

Another article worth looking at is at Lorelle on WordPress where she gives a brief summary of designing a WordPress theme from scratch.  She mentions the Firefox Web Developer Extension, which I agree is an indespensible tool when creating your own WordPress theme.

As a final resource, a must-read is the WordPress codex on Stepping into Templates.  This is basically the official manual on creating WP themes and templates, and you'll also want to take a look at the Design and Layout section also.  It has a vast resource of design techniques and information relating to creating your templates.

Once you've read through the resources listed above, you're going to have the tools and tips you need to convert your standard HTML template into a WordPress theme.  WordPress is not difficult if you have some knowledge of PHP and CSS, but if you're new to both, you may want to bone up on your skills a little before tackling a WP template.