I have been wanting to redesign my website for a long time. A really, really long time. And I wanted it to be something that I created from the bottom up, not just some WordPress theme that I found and installed and customized. So I figured out how to develop a simple WordPress theme, which is basically just CSS, and a few modifications to the PHP files if you’re into that sort of thing.
First, I set up a dev environment on my local machine using MAMP and then installed the latest version of WordPress. I used the WordPress export tool to create a backup of my live site, and then I imported that backup on my local machine’s WordPress install so that it would be as close as possible to the real site.
From other projects that I’ve worked on in collaboration with Daniel, I’ve learned that using Sass is awesome. I set up Compass for my project both so I could use Sass, and also so I could use clever mixins to make less work for me!
Once the theme looked good on my local machine, deploying the theme turned out to be challenging for two reasons. First, I got PHP errors that didn’t make sense. (Admittedly, most PHP errors don’t make sense to me because I’m not, in fact, into that sort of thing.) All of them were complaining about syntax errors on line 1 of the files, on the server all of the code was on one line. Turns out that because I used some simple PHP files for my theme that I did not write, just downloaded, that the end of line format was different on my Mac than it was on the server. *sigh* An article on the Vim wiki was helpful in fixing that.
Second, when deploying a new theme, I figured out that I needed to add my sidebar widgets over again. I got this blank space where the sidebar was supposed to be and thought, “Aw, man, what else is wrong with the PHP files? Or is it my CSS?” Then I looked at the sidebar div and it was completely empty, and then I figured out adding the themes again was the answer.Obviously it’s been a while since I’ve changed themes.
So hooray, I’ve fixed the issues and I’m happy with how everything looks now. I think there are a few outstanding formatting issues in old posts and pages, but not enough to stop me from using my new theme. I figure, if they’re problematic for me or someone else, I’ll fix them if that time comes.
One of my pet peeves when blogs launch a new redesign is that the old design goes away, so there’s nothing for comparison for new readers to see what the changes were. And I’m really proud of these changes! So here are before and after screenshots so even if I redesign this thing many times in the future, this post will still make sense.