Flexible WordPress theme creation using themes

I think you have outlined a good broad approach, I will break it up into some sub-points for a more specific answer. I also think the important unspoken question here is: “Where do you draw the line between design and functionality?”

Because generally speaking, site features, content features and functionality should be kept to plugins and the layout / styling to theme. I’d not purchase a theme for features anymore which is quite a common mistake you can end up paying for in time (ah those pretty salespages.) So I have tried to make these kinds of distinctions clearer in my answer…

There are plenty of plugins that can do a better job of features individually without tying you to a particular theme – which can cause extra work or problems if the theme turns out not to be what is needed and you need to change it! (Better practice for premium themes is when they ship with separate feature plugins, and so long as they work independent of the theme itself that is fine, whatever combination the project needs.)

But I digress, here is my suggested approach…

  1. Discover what the content is the client wants on their site, along with any goals they have… etc

    i. Content: Determine the different types of content that will be used and what may be needed (ie. posts / pages / custom post types? / post formats?)

    ii. Plugins: Determine the major needed site features (eg. shop, forum, directory, job board, FAQ, Q&A, newsletter, etc.) and needed content features (eg. sliders, widgets, galleries, social, shortcodes.) Add to that any functionality / utility plugins (eg. anti-spam, security, SEO and any other of a million things that might be needed for the project. You will have a list of your favourites growing over time I’m sure.)

    iii. Theme: Determine the look and feel based on client’s wants and target audience. Again the design is best treated separately to features and functionality.

  2. Find a plain html / css/ js designed site that the client likes a lot. (split this step!)

    i. Find a blank / whiteboard / skeleton / starter theme / framework that suits your development style and/or experience. (This is really a question in itself. There are many options available.) Broadly speaking there are flexi-themes with tons of in-built options, to bare frameworks that you can build from scratch on, to anything in between.

    ii. Find free themes and premium themes whose overall style design matches your client’s needs and target audience. Searching within a particular niche or keywords can show you some great designs. Find a variety and then create a shortlist.

    iii. Go through the short list with the client to identify what style elements are to their taste. Again with the target audience in mind. Take note of which style elements from different themes might best suit the needs. Get the client to purchase the best matching theme (if premium) so they can use the styles and any associated graphics (background and header graphics aside, as these are generally swapped out.)

  3. Convert that theme into a WordPress theme.

    i. Set up the content types. Create the theme layout using your starter theme / framework (preferably via a Child Theme.) Add the needed plugins for all the feature / functionality.

    ii. Identify page elements and retarget desired styling from the themes already identified (free / premium) to match framework elements. Colours, fonts, spacing, graphics etc. This may seem like more work – but it is actually less work than doing it all from scratch. (Alternatively, if you do prefer starting from scratch just do it that way! You can still use the identified themes for inspiration.)

    iii. Integrate the theme styles back into the major plugins areas to match as needed (as many will output their own templates / content areas etc.) Visit all the different sections on the site and identify any areas that need further work (don’t forget archive/search/tags/taxonomies etc.) Then just keep tweaking, tweaking, tweaking… and tweaking some more.

Generally I’ve found this to be the fastest approach myself, mostly because it lets you pick and choose more easily for a project. The downside to that is some more time spent integrating things, but really I think that is unavoidable anyway. I hope that this gives you some pointers and ideas for your own approach.

Side question: As for shortcodes, they are definitely plugin functionality. Because if you do need to change your theme you will need to reformat your content – and that is a theme usage fail as it is a lot of unnecessary work. (A similar thing can happen with some page builder plugins that use shortcodes.) There are plenty of formatting shortcode plugins available, simply test a few and find one that best suits your needs so you can use it across projects too.

…all this still doesn’t answer the question of how to choose a starter theme or framework or what might be available out there… but for now, here is a list of various (free) ones that I’ve found:

BioShip, Bones, Buffet Framework, Customizr, Flagship Compass, Hybrid Base, JointsWP, Nebula, Reverie, Skeleton, Sage (Roots), Thematic, Underscores, Weaver Xtreme, Whiteboard

My personal picks from these (according to my development style) are Nebula and BioShip. There are some notable premium alternatives too that provide more support as a result, let me know if you want me to add those.