Today we’ll be building a minimalist Wordpress theme from a Photoshop mock up. We’ll start from scratch, so we can really understand how themes work within Wordpress, and what a real life workflow looks like. There will even be some custom PHP function code. Yikes! The theme’s files are located here.

Step 1 - Analyzing your PSD

First, we’ll take a look at the mockup we’ll be using.You’ll notice it doesn’t look very complicated.

That’s a Good Thing, because building a Wordpress theme from scratch involves a lot of steps. For our first theme, it’s much better to keep things simple, so we can focus on the individual steps. First, we’ll split our mock up into HTML, then we’ll add our CSS and images. Next, we’ll replace the static html code with dynamic Wordpress template code. Finally, we’ll break our code off into individual files, so our header, footer, and functions can be reused by every template we create.

I also like to get an idea for what portions of my mockup will be dynamic here. Greed, Power, and Avarice will be categories, and the rest is outlined below.

Read the rest of this entry »

• 6 Comments

Building software has always been difficult. You’ve got to build something without being able to see, touch, or taste it. Thanks to Open Source Software, however, it is getting a whole lot less painful.

Consider my latest project, SoRelated.com. It is a web application designed to help families keep in touch. A user joins the site, creates a Family, and then adds their relatives. They then have private conversations and post images to one another in their family. It is a private family blog basically, and it was written completely from scratch in under 1 month. To put the server live, it only cost 20 bucks for a Slicehost Slice.

Because I was able to leverage so many Open Source projects like Django, Nginx, PostgreSQL, Ubuntu and Pinax, the development of this project has gone by in a blur. The majority of work has been spent in developing the feel of the site, and not in finding invisible little bugs.

As a matter of fact, with Instant Django, I was able to get a working site up and running in a couple of hours. That’s incredible, considering I didn’t know Python or Django beforehand. The documentation on Django has been awesome, and there’s even a free book online.

After a few weeks of toying around with Instant Django, I decided it was time to start thinking about putting my toy project somewhere. Looking around at webhosts, I realized deploying Django would be a bit more complicated than, say, a Wordpress blog. You’ve really got to have shell access to set up a fast site.

So I decided on a completely custom server.

It looked very difficult to build a server, but the execution has not been hard at all. The Open Source Community really provides great documentation, and Slicehost provides great articles on setting up your web server, mail server, SQL server, SVN server, and every other server you never knew you needed until you build a web app from the ground up.

Granted, I haven’t created Facebook or even Reddit or anything remotely complicated, but I have learned infinitely more than I knew at the beginning.

The three biggest lessons I’ve learned from developing SoRelated:

CODING BEATS READING

It is always better to code and experiment than it is to read and theorize. Coding solves problems, or at the very least creates new ones to fix. A broken application is better than a great application in your head. All the things that seem like they’ll be difficult in your head end up being easy, and all the things you didn’t think about are hard.

START ITERATING IMMEDIATELY

Take the extra time at the beginning to make everything modular and separate. Then create one piece, followed by the next. With Django, this process is especially easy. You create your models first, then define your views, then define your templates. A streamlined way to force yourself to stay neat.

STAY SIMPLE

There are a million little things that would be cool to include in any program. Don’t include them. They’ll only make your life miserable, and add to your code complexity. Code complexity is the worse thing in the world. Keep your code clean and simple, and stay the hell away from “smart” code. “Smart” code breaks when something nontrivial changes.

Finally, I’d like to close with a little soap boxing. With all the economic doom and gloom it’s easy to get apathetic and decide things are only going to get worse. A lot of big companies and big government have proved inefficient at solving real problems. But, they are leaving open a huge opportunity for small scale development and problem solving. I encourage you to personally evaluate what you can do to improve your world without requiring their help…

Because they might not be there when you need them most.

Thanks!

- Kirk

• 0 Comments