Speeding up the time it takes you to develop new WordPress themes can become a very critical habit that will help you as you continue on in this business. When most freelancers start out, they usually are sure to take on one client at a time. As you get more comfortable and know your limits, you may become a little daring and take on two, maybe three clients at the same time. If you respect yourself enough to deliver quality work in a timely fashion to these clients that put their faith (and money) into you, you better hope you have sharp time-management skills.
I know how much time goes into WordPress themes, and on my next project, I'm making it a point to time myself. Every time I put even a little bit of work into the theme, I'll be sure to punch the clock. I'm going to go ahead and take a guess that from beginning to absolute end, the production of a well-developed WordPress theme can take 20-25 hours.
Anyway, today's post will revolve around some tips that I use myself that will speed up the production of your theme projects. Try to implement these next time you work on a theme and notice the increase in motivation (because everything is easier and already set up for you, in some cases) and how much time you'll save.
Tip #1 - Begin With WordPress in Your Head
I'm going to go out on a limb here and assume that all web designers begin their designs in Photoshop (or another program like it). When you begin your design, make sure you have WordPress in mind. This is easier for experienced theme designers, as they're aware of what WordPress can and cannot do. Believe it or not, WordPress can't do everything.
Because of this, make sure your designs are built to accommodate for the weak areas in WordPress as well as build upon it's strengths. Don't forget, WordPress is a very powerful content management system, make sure that shows through your theme.
Tip #2 - Set Up a Blank Workspace
This is one of my favorite points that saves me alot of time. Getting started with any project is usually the hardest part. What if you can pre-start all of your theme projects before you even start them? (Wait, that didn't make sense.) What I'm trying to say is to build a default blank folder. In it, put a file called style.css and another called index.htm. These will be the files you begin with when you start your WordPress projects.
Also be sure to add an /images/ folder and maybe even a /js/ folder, too. Throw in all the default javascript files you usually use, like jQuery or another library. What you're basically doing is trying to get everything you need set up beforehand, so when the time comes to finally start coding, it's not a hassle.
Tip #3 - Set Up the Files
Now that you have all of your files created, time to add stuff to them. You know, the default stuff. For the HTML file, that would be things like the HTML basic framework, links to the favicon, stylesheet, javascript libraries, etc... For the CSS file, be sure to add all of your default resets and basic divs, such as the #container, #header, #footer, etc... Remember, all you're doing is trying to speed up the designing-to-coding transition. This, in the end, speeds up the entire development of your theme.
Tip #4 - Do NOT Touch the WordPress Files
By WordPress files, I mean the ones like index.php, sidebar.php, footer.php, etc... Do not even think about touching any of them until you are done coding your design in simple HTML and CSS. Only once you're done there should you move onto the WordPress files.
A simple checklist to follow to verify that you are done with the static files would be to check for any possible bugs, cross-browser compatibility, valid HTML and CSS code, etc...
Remember, if you're distributing this theme to the public, it's going to be used for countless types of blogs. You never know what type of situation your theme may be in, so be sure to try to cause bugs to occur. Now is the time for you to make them rear their ugly heads. Once you spot them, all you have to do is find a way to patch them up. It is much easier to fix these bugs now rather than one the code is mangled up in the WordPress files.
Tip #5 - Copy & Paste Old Theme Files
I figure this tip is common sense, but you never know. Once you're done with the static files, it's time to actually get to work in WordPress. Crack open your text editor of choice and get to work creating all of the default WordPress files. I recommend starting from archives.php and going up in alphabetical order. Go ahead, I'll wait.
Doesn't that seem sort of silly? Why re-create all of the files, when you most likely have them all sitting in another theme folder on your harddrive? Just copy and paste them into a new folder and leave them be until your ready to work with them. An advantage of doing this is that when you are working in these theme files, most of the WordPress php snippets are already in the files, so all you have to do is copy and paste them to the correct locations.
Tip #6 - Have a Cheat Sheet on Hand
Don't worry, there aren't an teachers around. You can use cheat sheets when working in WordPress. Can you even fathom how many small, little WordPress php snippets there are available to you? What I recommend is that you have a text file that has a nicely organized list full of all of the WordPress snippets you find yourself using often as well as snippets you think are interesting or plan on using in the future. The more you have, the better. Just be sure to keep organized. For example, have a section for all of the header-based snippets, then one for the The Loop snippets, etc...
Some posts I deem worthy to bookmark from ForTheLose.org:
- 15 WordPress Theme Tips and Tricks to Make Your Theme Even Better
- How to Create a Theme Options Page
- 7 WordPress Theme Trends and How to Implement Them Yourself
Tip #7 - Keep Useful Articles at Hand
This is a perfect example. See this article you're reading right now? Bookmark it. Who knows when you'll need it.
I'm kidding. (But seriously, bookmark this.) Whenever you come across a useful WordPress-based article or tutorial that interests you, just bookmark it. I myself have a folder in my bookmarks that is specifically for WordPress tutorials that I felt were really well written and could come in useful when I need them. The more resources you have on hand, the less searching you'll have to do when you run into a problem or have a question about something. Remember, all of this adds precious time to your "me-time" at the end of the day.
Tip #8 - Cheat Off of Your Partner
Hmm, maybe I should have worded this header better. Eh, it was probably interesting enough to stop you from scrolling down the page and force you to actually read for a second. Anyway, I don't necessarily mean to "cheat", think of it more as just a getting a little bit of help. I think it's better if I use an example for this one.
When I was trying to learn how to create a Theme Options page for the first time, a very useful resource for me were free WordPress themes that already had Theme Options pages built in. I found as many of them as I could and I downloaded them. Once I had them, I just looked through the functions.php file and took in all the techniques and strategies they used to create their Theme Options page. What did this lead to? Well, lets just say my two latest free WordPress themes are getting constant praise over the intuitiveness over their Theme Options pages.
To sum up, learn from others. Download other popular themes and look inside them. See what makes them tick. The more you know, the better off you are.
Tip #9 - Test Your Themes Properly
Once you're done coding and your theme is functional in WordPress, put it through hell. You basically want to put it through every possible situation that it could possibly go through in an attempt to find all of the bugs you didn't catch before in step 4. To do this, I recommend you have one dedicated WordPress install that has premade posts, pages, tags, categories and comments.
Make sure you have extreme posts that have ul's, ol's, blockquotes, heading tags, code snippets - basically anything that can be used in your theme. Same for the comments. Be sure to have images in some posts and pages to make sure they don't fubar anything.
Also, make sure some of the post titles are incredibly long. This will verify that your theme can handle overflowing titles. Get creative here. The point is to make sure your theme is bug-free. You don't want to release a half-assed product to the public, do you?
Tip #10 - Goddammit, Turn Off That Twitter App
As much as your loyal followers would love to know that you're working on a WordPress theme for the sixth time today, just turn off that damn Twitter application. While you're at it, shut down your internet browser, turn off AIM, log off Facebook, and pull up your pants. It's seriousness time now. All of these things just eat up your time and distract you from your real goal. Trust me, you'll be surprised at how one interesting tweet can turn into an hour watching Flash movies on NewGrounds.com.
I find that listening to music helps me to focus, it seems to filter out everything else and sometimes puts me into a trance where I can work for hours before I realize it's 3am. Try it.
Tip #11 - Set Goals
This one is very useful and I've done it tons of times. Set a goal before you start working. Just something simple, nothing complicated.
I will code the sidebar and footer sections today.
That is a perfect example of a goal. Then, once you reach the end of the goal, try to push yourself to get just a little more done, kind of like weight training. You know, when you finish that set of 10 reps and decide to try and push out just two more. You'd be surprised how the snowball effect can really benefit you here in the long run.
I remember back when I first started with WordPress, I used to be able to crank out theme after theme just like that. (Note that when I started working with WordPress, I was in summer vacation from school, so I had alot of free time.) I would literally start and finish a theme in the span of one or two days. Mind you, this is not because I used the tips I just wrote about, I simply wasn't skilled enough with WordPress and so the themes were of crap low quality.
Nowadays I look back and ask, "How the hell did I manage to do that?"
Anyway, what methods and techniques do you use to speed up your WordPress theme development? Drop a comment!
If you liked this post, stay updated. Follow me on Twitter or subscribe to our RSS Feed via email.
Post Tags: How-To, Web Design, wordpress
Like my Professor says: "Why re-invent the wheel? If the code is out right already due bookmark it or say it. There are a few program that help you save snippets on code and have them handy. Also pulling you'reself out of Twitter, aim, and you're cell phone is a good idea. Like stated here, even some small msg could take one good hour you could've used to develop. Great post once again Ralph.