2

I'm working on a plan to build new Wordpress themes very rapidly. Though, I have some question about it's implementation.

Here's the plan.

  1. Discover what the content is the client wants on their site, along with any goals they have..etc
  2. Find a plain html / css/ js designed site that the client likes a lot.
  3. Convert that theme into a Wordpress theme

I want as much flexibility as possible, less variation in development time, and the ability to or remove features as I need to. For example, if I want to add a new social media widget, or a special navigation menu, or some wicked slider, or whatever it is...

However, I still need elements that are provided via shortcodes for the content on a website. Lists, styled titles, tables, tabbed tables, FAQ list boxes, and especially shortcodes for a grid layout for text.

4
  • I don't quite understand. I know how to write plugins and themes. But what exactly does Genesis do? For example, can I buy a plain html/css/js theme from some template broker, convert it into a genesis theme? And if I can do that, does genesis provide elements like the ones I mentioned?
    – ninja08
    Mar 20, 2016 at 5:17
  • The problem I'm running into is that when I buy a Wordpress theme, many times the theme is set up in such a way that creating child themes from them doesn't work. They're bloated and vary in flexibility. So to safeguard against this uncertainty I wanted to find a way to add only the parts to a website that I really need. So when I buy a theme, it would be a plain html / css/ js theme. Then converting it into a Wordpress theme. Then add in content elements..etc Why, then, use Genesis if I can create my own widget areas and layouts?
    – ninja08
    Mar 20, 2016 at 5:34
  • WordPress is very flexible with hooks so lots of time its possible to correct a theme which is not ready for being parent. With some code in the functions.php of the child theme, you can dergister hooks and CSS scripts of the parents to help to custumise the theme
    – mmm
    Mar 20, 2016 at 6:18
  • @mmm I re-wrote my question. thanks for your reply. The issue I'm seeing is that some themes are just so specialized that they can't be modified with a child theme the way I need them to be. Or they require a lot of time to read their docs to figure things out.
    – ninja08
    Mar 20, 2016 at 6:24

1 Answer 1

2

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.

5
  • Thanks for taking the time to write this up! It makes clear how to separate everything that goes into creating a theme. I did find some great plugins for content elements. The biggest issue I'm seeing right now with buying someone else's theme, however, is that there is still a huge learning curve in figuring out how the author organized all their files, and how they weaved all the elements together. But I suppose that's the price of flexibility in this case.
    – ninja08
    Mar 22, 2016 at 17:00
  • 1
    I think this is where you should find the starter theme / framework you like and familiarize yourself with it's layout / structure / page templates / coding instead. So that Instead of worrying about those each time in the theme you are "importing" from, you can instead indentify the HTML elements and targeted styles from stylesheets used in it (and if needs be matching them up to the existing HTML elements)... and focus on retargeting those to your starter theme / framework HTML elements and structure.
    – majick
    Mar 23, 2016 at 3:27
  • 1
    So that similar to how there is a distinction between design and functionality, you can make a distinction within design between structure and style.
    – majick
    Mar 23, 2016 at 3:28
  • 1
    I've added some links to various options / starter / framework themes. :-)
    – majick
    Mar 23, 2016 at 5:33
  • Hey thanks so much Majick! That's a great list of resource to start with.
    – ninja08
    Mar 23, 2016 at 21:54

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.