Pre-built themes and templates provide you with a quick and easy way to get started with responsive web design. Many of them do all the work for you and provide a simple plug and play workflow, others just take care of the heavy lifting by taking care of the media queries and give you complete control over design. This post contains 20 free and premium templates, all of which are fully responsive right out of the box.

Like the article? Be sure to subscribe to our RSS feed and follow us on Twitter to stay up on recent content.

Responsive Layout: Fad or Necessity?

There’s been a ton of discussion about responsive web design lately. Many hail it as the future of web design and even go so far as to say that you’re simply not doing web design the right way if your sites don’t conform to their specific formula for maximum compatibility. Others contend that this is just another toy in a long line of fads that come and go.

The answer is likely somewhere in between the two. The truth is, web design has indeed hit a major obstacle with the wealth of different screen sizes that now access the web regularly. Many sites can neither afford to leave out large portions of mobile users nor can they build custom sites perfectly tailored to every smartphone, tablet, laptop and desktop on the market.

Responsive design, be it trend or not, is currently the best answer to this problem. If media queries fall out of favor it will simply be because a better solution has come along, not because the problem ceases to be important.

I can’t say how we’ll be developing sites ten years from now, but you can bet that screen sizes will only continue to become more fragmented as everything with a battery or plug is quickly becoming capable of accessing the web. If we define “responsive” web design as a set of techniques used to ensure maximum compatibility across as many devices as possible, then we are definitely not looking at a fad but the current and future standard for professionals in our industry.

Some complain about the added effort and development time but it’s really not as bad as you might think and once you’ve pulled it off a couple of times the impact on your workflow can be quite minimal. The tools in this post make it even faster, taking most of the pressure off you when it comes to the responsive elements.

20 Responsive Templates & Themes

Yoko – Free HTML5/CSS3 WordPress 3.1+ Theme

“Yoko is a modern and flexible WordPress theme. With the responsive layout based on CSS3 media queries, the theme adjusts to different screen sizes. The design is optimized for big desktop screens, tablets and small smartphone screens. To make your blog more individual, you can use the new post formats (like gallery, aside or quote), choose your own logo and header image, customize the background and link color.”

Price: Free

Skeleton

Skeleton is a boilerplate that successfully makes developing responsive websites a breeze to accomplish. We’ve written about it a few times on Design Shack and really love its simplicity. Along with the download you of course get a demo file, which can easily be used as a starting template to build your own work on.

Price: Free

Super Skeleton: Responsive, Minimal, Beautiful

“SuperSkeleton is more than a template, it’s a comprehensive HTML5 framework; A collection of several incredibly powerful scripts and CSS structures that’s been tied together into a kit that’s perfect as a jumping off point of your next project.”

This is a super premium package with 20 HTML templates, a PSD UI kit, multiple skins, fontstacks and more. It’s a steal for under $20 and is the perfect way to launch your ventures into responsive layout.

Price: $17.00

Responsive Twenty Ten (WP Theme)

Responsive Twenty Ten is a child theme of the default WordPress theme with lots of great features like flexible images. The authors give you permission to “download, take, use, change, and do whatever you want with it.”

Price: Free

Onextrapixel Responsive Web Design Template

A very basic but solid free template/tutorial for responsive web design. This is perfect if you just want to dig around and see how a simple responsive template works without all the fluff.

Price: Free

The Novelist: Responsive WP Theme for Writers

A very unique looking theme with a simulated open book interface that scales nicely when you resize the browser. Perfect for personal writer portfolios.

Price: $35

Ari WordPress Theme

Ari is a very minimal blog theme that is super attractive in its simplicity. It’s built for WordPress 3 and up and features both a light and a dark theme. You’ll definitely want to give this one a look.

Price: Free

Golden Grid

Like Skeleton, Golden Grid is more than a template, it’s a framework for building responsive sites. Self-labelled as a folding grid for responsive design, “the 16 columns can be combined, or folded, into 8 columns for tablet-sized screens, and into 4 columns for mobile-sized ones.”

Price: Free

Hero – A Responsive Single Page Template

“A responsive, clean and minimal style single page template for personal and business type. It has a fixed menu on the very top of the document for easy to navigate. It has also a 10 pixel border in the body.”

Hero comes with both a light and dark theme, both of which look great but the dark is especially slick.

Price: $14

Good Minimal – A Responsive HTML5 Template

“Good Minimal is a clean and minimalist style template that is good for portfolio, blogs and businesses.” Very similar to the previous template in many regards but with a bolder, more unique design. I really like the look of the typography in this one.

Price: $14

iTheme2 (WordPress)

iTheme2 is a gorgeous free blog template that has a responsive layout and tons of great features like a customizable feature slider, a social media widget, two theme skins and more.

Price: Free

Folio Two

“Folio Two is an advanced portfolio, a practical and usable template designed with HTML5 + CSS3 and using jQuery to enhance an awesome user experience.”

This template features a really nice big grid of images that morphs smoothly as the browser window resizes. The grid looks great both small and large!

Price: $12

Grido WP Theme

Grido is an awesome and impressive feat of web layout tricks. It features both a masonry-like layout and a responsive system that readjusts that layout for several screen sizes. It comes with multiple color schemes, a lightbox gallery, seven skins and more.

Price: $39

Flexible WordPress Theme

“Flexible is a WordPress Theme that helps present your content and display it to fit different screens sizes, with a design of your own. It also provides a really easy integration with Facebook and Fan Gate option, a must have if you are running a website.”

Price: Free

Deresan Gray Profile Template

A sophisticated looking template with a nice neutral color scheme, an image slider and lots of great little design touches. The responsive scaling isn’t my favorite but it is functional.

Price: $14

Constellation WordPress Theme

This theme has it all. Not only is it responsive, it’s built on HTML5 Boiler Plate and contains both a horizontal grid and a pixel perfect vertical rhythm that scales nicely across devices. This is the perfect starting point for your next WordPress project.

Price: Free

Seamless Responsive Photo Grid

A nice little experiment from Chris Coyier that you can download and use. It’s basically just a big grid of photos that instantly adjusts to difference browser window sizes.

Price: Free

Tisa WP Theme

Another great looking and responsive Themify theme with lots of big images, a beautiful color scheme and six theme skins.

Price: $39

Meerkats Responsive WordPress Theme

“The Meerkats Theme is built to respond to different platforms and devices. It is a simple and basic WordPress theme built by Gregor McKelvie. ”

Price: Free

Whiteboard Framework

“Whiteboard framework for WordPress was developed to speed up the process of developing a WordPress theme. Whiteboard does so by eliminating the time spent on code common to all WordPress themes and includes non-intrusive code that improves the overall WordPress theme in many ways – including SEO, speed, usability, and mobile support.”

Built on the Popular Less Framework, Whiteboard utilizes both HTML5 and CSS3 and gives you a nearly unbeatable starting point for developing perfectly responsive WP themes.

Price: Free

Conclusion

With these twenty amazing resources, you should be fully armed to begin creating responsive web designs in both straight HTML/CSS and WordPress. No matter what your budget is, there are several themes and templates here that are perfect for you.

Leave a comment below and let us know if we missed any. Have you come across any great responsive templates and themes? We want to see them!

Not only is the software very powerful but the underlying classes and functions give developers an all-access pass. It is extremely simple to develop apps and modules within WordPress. Today we’ll be looking into author meta data functions for building an “About the Author” box.

Like the article? Be sure to subscribe to our RSS feed and follow us on Twitter to stay up on recent content.

Towards the end of single post pages you may frequently see a box explaining a bit about the writer. This will generally include their Gravatar or some sort of photo, a description about them, and possibly links to their profiles or personal website.

If things seems difficult check out some of WordPress’ documentation on template tags. These include much of what can be covered in this project and a whole lot more. The WP community also runs a very pleasant forum for in-depth system questions.

The WordPress Architecture

There is something referenced throughout WordPress code titled The Loop. This is a section where meta functions can be called based on a single article to pull down specific information from the database. As per our example we can call functions to pull out author data from any single post within The Loop.

Most notably this should be done within your template folder. For the lazy, it may be easier to edit individual files by adding code you’ll need. For example, the WP theme single.php file generally contains all code to parse on an individual posts’ page. You may find it easier to pull data while inside The Loop and add HTML code here.

Alternatively, a safer method would be to add a new file to your theme directory and include it whenever you’d want your author box to appear. This allows for greater control regarding variable terms and template files. This also saves you time and energy so as to not go back and re-invent the wheel.

WP Template Code

There aren’t many functions we’ll be using, though many could be new to WP amateurs. Below are just a few examples which you should familiarize yourself with. Much of what we’ll be covering works within the WordPress library with just a few key ideas – nothing that can’t be learned with a few hours of study.

<?php echo the_author(); ?>

The author function pulls data from within the loop to display the author’s name. This can be changed in the WordPress backend on anybody’s profile settings page. You are able to set this value to First/Last name, username, or even a custom set.

To make this process simpler, WordPress has released an entire function library for the_author_meta(). This replacement takes in arguments which can pull any author data from the database on request. You can check out the page documentation if you’d like to research more into the subject.

What’s fascinating about this function is how much information can actually be obtained. By default the function accepts two arguments: the type of data you need and the user ID to pull. The ID is an optional parameter which is only required in cases outside of The Loop. Possible values to pull include user_login, user_email, user_url, nickname, description (bio), jabber/aim/yim, and so much more!

What many don’t consider here is just how much potential information can be shared. WordPress allows for administrators to edit author profile pages to add in custom avatars, bios, and even home page links. These can then be pulled from the database and used as marketing information for each author.

With just these functions alone we are able to display all of the set data we will need. The only thing left to do is add our sample HTML and CSS code and publish the file!

Cordial Author Box Styles

CSS is an important language in our project scope, being a web application. We need to define specific sets of styles and display cases to incorporate for all major browsers, monitor resolutions, and other hidden variables. As web developers it is our job to study and work over these climates.

.aboutauthor { overflow: hidden; background: #f4f4f4; border: 1px solid #999; padding: 5px; margin-bottom: 10px; }
.aboutauthor img { background: 0px; border: 0px; padding: 0px; }
#aboutauthorimg { float: left; padding: 5px 0 5px 10px; }
.aboutauthor .span-desc { overflow: hidden; margin: 0px; width: 500px; float: left; }
.aboutauthor .span-2 {display: block; float: left; margin: 0px 10px 0 0; padding: 10px 0 0 10px; }

The simple class .aboutauthor should be applied to your covering box. We have added a light background color with a solid border and extra padding. Our img tag is also displayed floating left with extra padding. This will keep our author’s avatar in line with box content.

Further, we have two classes which demonstrate how we need our inner data to perform. .span-2 is a class held inside where our main content will be found. Inside here we have removed all extra margins/padding to keep spacing neutral, along with rearranging the box model for left alignment. This code would do best inside your template’s style.css file, though it could be added inline with your block element.

The HTML code is very short and similar as seen below. Here we have added a few extra functions which can be explained very quickly.

<div class="aboutauthor">
<div id="aboutauthorimg" class="span-2"></div>
 
<div class="span-desc">About Author: <strong><?php the_author(); ></strong>  (; Articles)
<strong><?php the_author_meta('display_name'); ></strong>
</div>

We are calling a function get_avatar() which takes a set of parameters. The two we have passed above are the current author’s e-mail address which is the unique identifier for a database query. This could be equivalent to a user’s ID, too. We also pass in 64 as a string value – this represents the size of the image we want returned squared off in width and height.

the_author_posts() is another fairly straightforward function which pulls the total number of articles a writer has published. This is more of an added feature as I don’t see many blogs running this info. Commonly, though, this is useful from a users’ perspective since it gives more information about the current author and deeper insight into their interaction with the blog itself.

These are just some of the basics techniques for building a simple WordPress author block. From here it’s very simple to save a new file, let’s say author-box.php into your themes folder and upload into your root directory. From there a simple PHP include can add all of your code right into any source automatically.

<?php include(get_bloginfo("template_url").'/author-box.php'); ?>

If this is still a bit fuzzy, check out the example code above. This would be the most direct way to include your file and sustain security in your actions. Here we are calling the get_bloginfo() function to pull our entire template directory structure out first, followed by our single data file. Be sure to rename this file to whatever will suit your theme best and don’t get confused between function calls!

Conclusion

Hopefully this tutorial has given you a starting point for reference in WordPress development. Blogs are all too common in today’s web, but adding an author box gives your online articles some flare. They also give incentive for authors to post more frequently and build up a small portfolio of their writing. Many of the most popular magazines online now feature detailed information and profile links from their article writers.

If you’d like to experiment with these features without messing around in PHP or HTML/CSS, there are a few alternatives. The WordPress plugins system is one such scenario which works perfectly. I recommend the Cool Author Box plugin which will automatically add author info and supports gravatar icons. Do you have any suggestions or tips for building unique author boxes in WordPress? Share your ideas in the discussion below.

To follow up our article last week on tutorials for learning web design, below is a list of books and free tutorials specifically targeted at learning to develop for WordPress. Whether you’ve never heard of WordPress or are just looking to update your current WordPress skill set, there are plenty of resources below to get you on your way.

Like the article? Be sure to subscribe to our RSS feed and follow us on Twitter to stay up on recent content.

Free Tutorials

If you’re on a budget and need to learn quick, free tutorials provide a great way to get started and provide just enough information to help you pick up WordPress without bogging you down with too much unnecessary extras.

WordPress 3.0: Ultimate Guide to New Features (Six Revisions)

Many of the articles below are for older versions of WordPress so I wanted to begin by pointing out this guide to WordPress 3.0. The older articles still have plenty of solid information and relevant examples, just be sure to keep the newest version of WordPress in mind when reading them.

How to Create a WordPress Theme from Scratch: NetTuts

“Following on from the recent article on “PSD to HTML”, this tutorial will look at taking a HTML/CSS template and turning it into a functioning WordPress theme. There is so much you can do when creating your own theme we couldn’t nearly cover it all. So, we’re going to look at how themes are structured, creation of the core files and splitting up that index.html file.”

Designing for WordPress: CSS Tricks

“Over the last few weeks, I have been been doing a video screencast series on Designing for WordPress. It is a three-part series which covers downloading and installing WordPress on a server all the way to a completed theme.”

Premium WordPress Theme Design: Design Reviver

“This time you’ll learn how to slice the design and convert it into XHTML + CSS, then I’ll show you how to use the css files to mock-up a WordPress template.”

WordPress Theme Development Checklist: divtodesign

“As you might know, I have been diving into WordPress theme development and I’ve learned many tips and tricks along the way. I noticed I was forgetting about some small issues all the time. That’s why I decided to make a WordPress Theme Development Checklist. ”

How To Create WordPress Themes From Scratch: ThemeTation

“I’m going to show you how to create a wordpress theme from scratch in these 3 parts of tutorial series. I will cover from Structuring, designing in Photoshop, slicing, coding into fully css based html, and finally wordpress implementation.”

Creating WordPress Themes: Introduction

“This new series will begin with the basics and then I’ll proceed to more advanced techniques. I will also be incorporating different techniques that I’ve picked up from other developers that I’ve found to be extremely handy, and I’ll be providing links and credits to that info as I go along.”

Developing a WordPress Theme: Dezinerfolio

“Instead of coming up with some more themes, we decided to write a tutorial on how to develop a wordpress theme which we are sure will help a lot of you to design as you wish and bring them out into wordpress. We are not too advanced wordpress developers but still we are sure the below tutorial will help you successfully develop a wordpress theme. Below you will learn to convert your xHTML CSS site into a Compact WordPress Theme (final output is same as the normal theme but here code is shorter and easier to understand).”

How to Build a Custom WordPress Theme from Scratch: SpoonGraphics

“If you’re confident with your CSS and HTML, it’s not hard at all to step up to the challenge of building a custom WordPress theme. This overview shows the process of how my latest custom WordPress theme was built from design concept through to completed theme. See how the static design is split up into the various WordPress theme files, and discover how the simple PHP snippets can add that dynamic functionality of a blog.”

Creating A Quality WordPress Theme: 12 Points to Consider (Noupe)

“But what exactly makes a WordPress theme great? How does one go about creating a quality theme? In fact, it’s not that difficult. You can do a few simple things while developing your theme—from the planning stage right through coding—to make it stand out from the legions of average (and below-average) themes out there.”

Customize Your Own WordPress Theme: Vandelay Design

“An increasing number of businesses and website owners are using blogs as a means of communication with their customers and website visitors. If your business already has a website it is possible to have a blog that matches the look and feel of your existing website without doing a complete re-design and without paying thousands of dollars to have the blog developed. Using WordPress you can tailor an already existing blog theme to seamlessly flow with the rest of your website.”

Designing and Coding a WordPress Theme From Scratch: DeveloperTutorials

“In this multi-part series I’ll detail how to create and design a WordPress theme from nothing more than your imagination using Photoshop, CSS, XHTML and PHP.”

So you want to create WordPress themes huh?

“Creating a WordPress theme from scratch is not hard. I’ll hold your hand through it. Tutorials on this topic have been written before and the WordPress website also has guides for you to follow. But are those tutorials and guides really helpful to you when you don’t understand the lingo? Even I got lost while reading the WordPress guides.”

Create Your Own WordPress Theme from an HTML Template

“In this article, I’ll show you how to take an existing HTML and CSS site template and convert it into a theme for WordPress. Of course, WordPress theming is much too vast a topic to cover entirely in a single article, so I’ll provide you with some resources at the end to further your learning. It’s hoped, though, that this article will serve as a good introduction and give you a solid foundation to start learning about creating your own WordPress themes.”

How To Create a WordPress Theme: The Ultimate WordPress Theme Tutorial (ThemeShaper)

“In Only 11 Individual Lessons this WordPress Theme Tutorial is going to show you how to build a powerful, up-to-date, WordPress Theme from scratch. As we go along I’ll explain what’s happening including (for better or worse) my thinking on certain techniques and why I’m choosing one path over another. Essentially, I’ll be teaching you everything you need to know about WordPress Theme development.”

Building Custom WordPress Theme

“This chapter will show you how to build a custom WordPress theme. Although the Codex site provides very good documentations on how to create a theme, but I find it too complicated for a beginner. In this tutorial, I will explain the basics of how WordPress theme works and show you how to convert a static HTML template into a theme. No PHP skill is required, but you need Photoshop and CSS skills to create your own design.”

Books on WordPress

If you’re serious about becoming a professional WordPress developer, it’s time to pick up a good book on the subject. These are usually far more in-depth than free tutorials and really cover the material you need to know inside and out.

Below are a few great books to consider in your search. Some are physical books that you can purchase on Amazon, others downloadable PDFs.

Rockstar WordPress Designer: $29

“During the course of the book you’ll build THREE WordPress themes, a blog, a portfolio site and a general site with menus and submenus. Each theme demonstrates different aspects of WordPress theming and all three are packaged in with the book so you’ll have Photoshop, HTML, CSS and WordPress PHP files to refer to.”

Beginning WordPress 3: $26.99

“WordPress is one of the most popular blogging and content management web templating platforms—it easily allows you and your business to make a statement about yourself and what you do. WordPress is also quite cost-effective, as it’s free for just about anyone to use. WordPress is colorful and flexible, and includes a variety of themes, templates, and plug-ins for you to explore and use. Beginning WordPress 3 aims to address these for the beginner who wants to start using and developing with WordPress.”

WordPress For Dummies: $16.49

“The bestselling guide to WordPress, fully updated for newest version of WordPress. WordPress, the popular, free blogging platform, has been updated with new features and improvements. Bloggers who are new to WordPress will learn to take full advantage of its flexibility and usability with the advice in this friendly guide.”

Smashing WordPress: Beyond the Blog: $29.69

“Smashing WordPress shows you how to utilize the power of the WordPress platform, and provides a creative spark to help you build WordPress-powered sites that go beyond the obvious. You will learn the core concepts used to build just about anything in WordPress, resulting in fast deployments and greater design flexibility. Inside, WordPress expert Thord Daniel Hedengren takes you beyond the blog and shows you how WordPress can serve as a CMS, a photo gallery, an e-commerce site, and more.”

Professional WordPress: $29.69

“An in-depth look at the internals of the WordPress system. As the most popular blogging and content management platform available today, WordPress is a powerful tool. This exciting book goes beyond the basics and delves into the heart of the WordPress system, offering overviews of the functional aspects of WordPress as well as plug-in and theme development.”

WordPress: Visual QuickStart Guide

“This book gives readers the tools they need to create beautiful, functional WordPress-powered sites with minimal hassle. Using the WordPress user interface as a baseline, authors Jessica Neuman Beck and Matt Beck walk new users through the installation and setup process while providing valuable tips and tricks for more experienced users. With no other resource but this guide, readers can set up a fully-functional and well-designed WordPress site that takes advantage of all the features WordPress has to offer.”

Using WordPress: $16.49

“WordPress has grown into the #1 blogging tool in its category: several million bloggers have downloaded this powerful open source software, and millions more are using WordPress.com’s hosted services. Thirty-two of Technorati’s Top 100 blogs now use WordPress. Using WordPress is a customized, media-rich learning experience designed to help new users master WordPress quickly, and get the most out of it, fast! It starts with a concise, friendly, straight-to-the-point guide to WordPress. This exceptional book is fully integrated with an unprecedented collection of online learning resources: online video, screencasts, podcasts, and additional web content, all designed to reinforce key concepts and help users achieve real mastery. The book and online content work together to teach everything mainstream Wordpess users need to know.”

Head First WordPress: A Brain-Friendly Guide to Creating Your Own Custom WordPress Blog ($23.09)

“Whether you’re promoting your business or writing about your travel adventures, Head First WordPress will teach you not only how to make your blog look unique and attention-grabbing, but also how to take advantage of WordPress platform’s more complex features to make your website work well, too. You’ll learn how to move beyond the standard WordPress look and feel by customizing your blog with your own URL, templates, plugin functionality, and more. As you learn, you’ll be working with real WordPress files: The book’s website provides pre-fab WordPress themes to download and work with as you follow along with the text.”

Closing Thoughts

I hope the resources provide the catalyst you need to begin your journey as a WordPress developer. In closing, I want to remind you that the official WordPress codex is definitely on of the best resources out there for all things WordPress.

Let us know in the comments below if we left out any of your favorite tutorials or books for learning WordPress.

WordPress is to professional blogging what Photoshop is to design. Sure, there are widely used alternatives, but it’s definitely the standard to beat. This post will examine how to sell, price and promote your WordPress themes.

The success of WordPress has spawned an insatiable appetite in the huge WordPress user base for quality themes. Many savvy developers have recognized this need and have either added WordPress theme design to their repertoire or crossed completely over to full-time theme designers.

As a WordPress theme designer, you can choose to sell 100% unique custom themes, stock themes (as template), or both. This post will focus mostly on the stock side but will definitely venture into the custom foray.

Can I Make Enough to Pay the Rent?

The answer to this question is a resounding yes. To squelch all the skeptics, check out this theme on Themeforest. Twicet (the name of the theme) has sold 1,458 times since July 2009. Multiply that by the $35 it costs to buy it and you have over $51,000 in sales in 6 months! Now granted, he only gets somewhere between 40-50% of that so at worst, this file has made him around $20,000 thus far.

The amazing numbers above represent passive income from a single theme (i.e., the Holy Grail). The sales of this theme will no doubt continue to make the author a healthy chunk of change for some time to come with zero additional effort on his part. In the mean time, he can probably think about quitting his day job to spend more time trying to replicate his success with a different theme.

So now that I’ve got you seeing dollar signs, let’s come back down to Earth for a moment. Realistically, this is the exception, not the rule. There aren’t tons of designers out there making forty grand per theme per year, there are very few. But there are a lot of hardworking designers making a decent amount of money selling stock themes on top of custom design services. Let’s look at how you can realistically become one of these designers while secretly hoping to score it big like the example above.

Where to Sell

There are a number of places to sell WordPress themes online. A smart designer will spread his work out initially to see where the biggest profit potential lies.

Your Own Site

Creating your own site like the one above is a great place to start. This comes with several benefits including complete creative liberty, the freedom to charge whatever you want, reaping 100% of the profit, and the lack of annoying reviewers who have the power to decide your fate.

Of course, this solution is not without downsides, the biggest being that being on your own means that you are on your own (amazingly redundant but packed with truth). It’s up to you to invest time in building an online marketplace for your themes. This goes beyond simply designing a pretty site to figuring out shopping carts and credit card payments. Another hurdle is that you are faced with the daunting task handling all your own promotion and marketing. We’ll discuss this more later but for now just know that getting noticed is neither easy or cheap.

ThemeForest

Mentioned in the success story above, ThemeForest is a great place to sell web design stock of all kinds. Uploading your work to a stock art site has pretty much the reverse of all the pros and cons of going it alone. The pros are that they do all the marketing for you and give you access to their huge pool of potential buyers. The cons are that you have to get your work approved (they have to be picky to maintain quality), they decide how much your work is worth and you take a huge hit in profit per sale. This is standard for all stock sites though and ThemeForest rates are among the most competitive out there. Below is a breakdown of how much you get to keep. Essentially, you start at 40% and work your way up.

WP Theme Market

WP Theme Market offers authors a variety of ways to distribute their themes. You can sell a WP theme under a single or multiple use license, distribute it for free, or sell one off custom themes. Sellers keep a whopping 70% by default and 80% if you use the WP Themer Kit to help build your theme. Free themes can contain affiliate footer links which provide an alternative way to earn cash.

99 Designs

99 Designs presents yet another way to make money as a WordPress designer. This time through a method called crowd sourcing. Crowd sourcing is highly controversial from the designer’s perspective. The essential idea is that a client submits a project and how much they’re willing to pay for it. Let’s say Joe Schmoe wants a WordPress theme for $350. Designers registered at 99 Designs then compete for this client’s business by submitting their ideas (the more the better). The client picks the best version and the prize money goes to that designer.

Why It’s Great:
Clients get to choose from a ton of options and styles from a pool of diverse designers. It’s an unbeatably cheap way to get a large variety of designs.

Why It Sucks:
Each contest involves several designers competing for the prize. With every design submitted by someone else, your odds of winning go down. This results in good designers wasting profound amounts of time producing quality work that they don’t see a cent for. Further, almost no measures are taken with these sites to ensure that designers aren’t just ripping off each other and other sites. Consequently the quality of a crowd sourced “custom” design can be significantly lower than traditional client/designer agreements. As you can imagine, crowd sourcing has created an angry mob of professional designers furious about losing work to the lure of having dozens of designers compete over scraps of money.

What to Charge

The best advice I can give you for pricing your WordPress themes is to look around and see what everyone else is charging. The reason I suggest this is because it is exactly what your potential clients will be doing. If you’re charging $100 over the competition, it’s going to be difficult to snag a lot of business. As you look around, do your best to compare apples to apples. Meaning don’t compare your bare bones single page theme to one with six pages and tons of features (or vice versa).

Keep in mind that pricing isn’t an issue with sites like ThemeForest. This is because they decide how much your template is worth and set a price for you. ThemeForest templates are currently going for between $12 and $47. My own research indicates you could stay competitive selling template themes for $45-$150 depending on quality. If you’re new to web development or WordPress theming, start near the bottom of that and work your way up as you learn to add more features and write solid code. Custom WordPress themes are another story and can go for hundreds of dollars or more. This greatly depends on the talent and experience of the designer as well as the demands of the client. Always seek to stay competitive but never sell yourself short.

Another really popular method of pricing themes is through offering subscriptions. Prices can range from $20-$200 per year for unlimited access to a library of themes. This method can provide great long-term profit potential.

How to Promote

The internet is a very big haystack and getting people to find your site is no small feat. Stock sites like ThemeForest take the pressure off by handling the promotion for you, but they take also take a big chunk of your sales. However, if you choose to take the route of striking out on your own, there are a number of ways to effectively drive traffic to your site.

Offer Free Premium Themes

If you’ve got enough themes to start your own site, grab a few and offer them up free of charge. Though there is no shortage of free WordPress themes on the web, there is not an overwhelming amount of amazingly high-quality themes packed full of options and features. Offering this kind of content free is a great way to get noticed. Be sure to include a “created by” link in the theme that will lead readers to your site. Also, send out emails to popular design blogs to let them know what you’re offering.

Another take on offering a couple of free themes is to offer a free version of all your themes. Obviously, the free version would be scaled down from the “Pro” version. This gives users the freedom to try before they buy. If you have a satisfactory product, many will come back to purchase the full version.

Running Ads

Sometimes to make money you have to spend money. There’s no guarantee it’ll work, but getting noticed is a heck of a lot easier if you’ve got an ad where the right kinds of people can see it. The first thing that probably comes to your mind is paying for an ad on a search engine like Google or Yahoo. This is definitely a good way to go but can be ridiculously expensive. A good alternative is to find a site like BuySellAds that provides quality impressions for reasonable prices.

When using a site like BuySellAds, consider your target audience. A good bet for WordPress themes is to target designers. On BuySellAds you can search for design related sites (like this one) and pick an ad spot that fits your budget (anywhere between $20 and $1,000 pre month). You then rent the ad space for a month. If it doesn’t provide you with a significant return, toss it and try another.

SEO

If you’re a web designer, this goes without saying. Good search engine optimization is the difference between getting on the first page of Google and barely making the first 100 pages. WordPress designers and themes are plentiful though so it won’t be easy to get good results even with stellar SEO techniques. Try to find a niche and shoot for top results within that category. It’ll be a lot easier to get on the first page of “WordPress designer Seattle” than “WordPress designer.”

Social Networks

Social networks like Twitter are home to thriving communities of web designers. Join the club, make some friends, and tweet your brains out. Be sure to share lots of relevant links and information and don’t blast your followers with advertisements. Once you build your followers through this method, the occasional mention of your WordPress theme gallery can go a long way.

Conclusion

That’s my spiel on making money designing for WordPress. Use the comments below to let us know how you survive and promote yourself as a WordPress designer. Is it just one of many services you provide or are you an all out full-time WP designer? Also, be sure to check back in a few days for part 2 on what needs to go into a good WordPress theme!

Simple Balance features a whole host of customizable options, and it’s great to see a free WordPress theme offering what usually would be paid for features:

• Several colour schemes
• Different advertising layouts
• The ability to manage adverts from the backend

Download Simple Balance

iFlickr Review

By way of a basic introduction, iFlickr is a WordPress plugin that allows you to easily find free images on Flickr and insert them into your blog post while automatically putting the attribution link underneath. It can save you quite a bit of time when looking for related images to your blog post, but doesn’t satisfy the requirement you may have for putting your own personal images on your blog (we’ll cover some methods for doing this later on).

Here are some of the various bits we liked and didn’t like so much about iFlickr:

The Good

• iFlickr makes it very easy to search for images as you’re writing
• It gives you more flexibility and precision than other plugins which attempt to automatically find related images
• It’s a very simple way to add some graphical content to a news article or blog post
• It’s fairly easy to use CSS to customize the way the image appears
• It’s completely free!

The Annoying

• iFlickr only works with PHP5. This may be fine, but not all servers come with this by default
• You can’t choose to only show your own images
• It can be a bit tricky to get working correctly (it took us a while)

If you’re looking to use an appropriate Flickr photo with your blog posts on a regular basis, iFlickr is definitely a good way to go. However, if you’d like to mix things up in a different way, trying one of the following might be a better option:

Other Flickr/WordPress Plugins

• WordPress Flickr Manager – This is a very fully fledged offering, which lets you search for both personal and public photos and insert them into your posts. It’s not as simple as iFlickr, but you might appreciate the bigger set of features.
• Flickr Photo Album – This plugin allows you to add a set of photos to your site as an album. Rather than picking one or two images, you are able to display a whole collection. Great for showcasing screenshots, or your holiday pictures!
• FlickrRSS – This lets you display a selection of your Flickr images as a sidebar widget. There are some useful advanced options for customising the display exactly as you want it.

We’d be really interested to hear about any other plugins which you find useful for integrating Flickr with your blog – drop us a line below!