Posted on by Dan

How to Create a WordPress Theme – Part 4

I made good progress on the To Do list last night:

  • Install copy of WordPress on development box
  • Import backup of live site content to provide some content for the development site
  • Create a bare-bones set of template files
  • Review the default CSS before beginning development of custom CSS for new template
  • Setup CSS for basic layout
    • 2-Column wide left, narrow right, approximately 75% – 25% split
    • Site width: 1024px (current width ~800px)
    • This gives almost the same relative widths as the current template, but with an increased overall width, resulting in a wider left column (and right) to give more room for graphics & code as desired.
    • Header will be short, ~ 5% +/- of screen height
    • Footer will be one or two text lines
  • Select color scheme
  • Select photo / graphic / logo for header and develop site-wide navigation in header

Pretty good work!

I want to show you a screen capture of the default starting point for the template, which is the supplied Kubrick template:

[image no longer available.]

Look familiar? That’s what you get after an initial install of WordPress if you don’t make any changes.

To show you just how much work is being done by that default template, here is what it looks like if you remove all the CSS that is being applied:

[image no longer available.]

Not very pretty, would you say? Well, after considering the two, I decided to start with the default template, and then tweak the settings from there.

Here’s a sneak-peak at what I’ve come up with so far:

[image no longer available.]

What do you think? You can see the result of a lot of the design decisions I’m making:

  • Width 1024px
  • Header graphic gives mountain scene
  • Leads to a blue, green, brown earthy palette for colors
  • Drop down tabs from header for page-level navigation (still more work to be done here)

I’m still working on getting the column widths where I would like, so you see the sidebar out of place still. Fonts have not been adjusted at all yet, for color, family or size.

Pretty good start for a few hours work. I think I will make my target launch of May 1 with no problem!