Designing with WordPress, Part 1: Building a framework

Designing with WordpressThe majority of my client work revolves around designing templates that need to be ported to WordPress. Anytime you’re doing a lot of work with one application, one programming language, or, in my case, one blog platform it makes sense to “streamline” your work environment.

So what do I do to increase my productivity? Simple: I don’t reinvent the wheel every time I start a new project. WordPress has a basic framework of template files and template tags that almost every blog needs. Blogs have certain elements that they almost always need styled - blockquotes, unordered lists, comments, and so on. Fortunately, I realized this shortly after my first few projects and since then I’ve always worked with a “framework” of sorts on WordPress-centric projects.

So how do you set up your own framework? Easy.

The first step is downloading a text editor that supports “projects” - I use TextMate and in TextMate a group of files that all belong to the same site are grouped in project files. I have heard that InType is comparable to TextMate and available to Windows users. As a side note: I really can’t explain how important it is to have a text editor that you are comfortable with, it will help increase your productivity significantly. I use TextMate because it gives me tabs at the top of my window for each file and has syntax highlighting for every language I’ve ever heard of.

wp_list.gifNow you just need to setup your default theme - add all the “important” files for a WordPress “theme”. If you don’t know what all those files are, check out codex.wordpress.org and look at the list of template files.

Within my files I include basic code that I don’t want to constantly retype. For example, in my index.php file I call the header.php, footer.php, and sidebar.php files. I also have a basic WordPress loop call. Within my CSS files I have a few classes and XHTML tags that I almost always restyle - paragraphs, blockquotes, lists, and a few element classes that seem to repeat themselves over and over.

So now, when I start up a new WordPress project I simply open up my default theme, re-save it as a new project, and get right to work. It saves me less than an hour on any given project, but the amount of time it saves in the long run is priceless. Plus I get to ignore the tedious task of setting up new WordPress projects every week or two.


Digg this!

{ 2 trackbacks }

Interesting Blog Links - Week 4 » All About Blogs and Blogging
February 24, 2007 at 6:38 am
links for 2007-03-07 - mattherzberger.com
March 7, 2007 at 1:21 am

{ 9 comments… read them below or add one }

1 Dennis February 11, 2007 at 7:01 pm

Good stuff Ben…..I actually started doing this a month or so ago and can say that I agree all the way. It would be interesting to compare your default to what I have.

2 noah kagan March 12, 2007 at 2:43 pm

argh. how come you made your site better than mine=P

3 AskaX August 15, 2007 at 1:57 am

Nice approach, its the same approach with making a software. Re-Used rather than making everything from scratch

4 jameswillisisthebest September 8, 2007 at 1:43 pm

This is my first post
just saying HI

5 MyDeskBlog.com October 28, 2007 at 7:31 am

Pretty much what I’ve been doing so far. It took me more than a month to pin down the basic Wordpress template framework I needed to work with. Then it took just 1 week to come up with my first design.

Goes to show how important a framework is for subsequent template designs.

6 Kfik.net November 14, 2007 at 4:30 am

cool

7 Undeltybreree December 2, 2007 at 11:39 pm

Thankiossk
Cool!

8 Jeff August 6, 2008 at 2:20 pm

any chance of you sharing your “framework” file with a newbie?

9 Ingef October 29, 2009 at 2:29 pm

I do not plan on using Bluetooth because it takes far too long for the amount of data that I want to transfer. Furthermore, iTunes does not seem to recognize my videos and podcasts as files that can be transferred to my iPhone when it is plugged into my mac.

________________
unlock iphone 3g

Leave a Comment

Previous post: Tips for dealing with freelancers (from a freelancer)

Next post: Designing with WordPress, Part 2: 3 simple tricks