WooThemes

The WooThemes Blog

All the latest news and announcements, straight from the WooThemes HQ!

Subscribe

Theme Framework? Huh?

48

by Adii Rockstar in Development

Earlier in the week we asked you how we could make Canvas more of a theme framework and you have responded with some great suggestions. But whilst we have been considering your suggestions & feature requests (and hence our lack of response), we couldn’t help but feeling that either our own message or your expectations were misguided / misaligned.

So we wanted to circle back to a “simple” question: What is a WordPress Theme Framework? The suggestion that initially came up in the Open Forum was for Canvas to be more of a Theme Framework and it seems that some suggestions relate to Canvas as a framework, but most are more straight-forward theme feature requests (i.e. those could apply to any of our themes; not specifically Canvas as a framework).

This is how WordPress.org describes a theme framework (with a bunch of examples too):

A Theme framework is a Theme designed to be a flexible foundation for quicker WordPress development, usually serving as a robust Parent Theme for Child Themes. Some Theme frameworks can also make theme development more accessible, removing the need for programming or design knowledge with options pages.

From that definition (and to expand on it a bit), these are the kind of features & functions that a theme framework generally includes:

  • Extreme customizability & flexibility to enable a developer to build anything on top of the parent theme / framework.
  • Hooks & filters (here’s a good explanation on that) to allow for easy development of child themes (for the more advanced developers).
  • A variety of easy-to-use theme options to enable users to customize the theme on the fly (aimed more at end-users).
  • Widgetized spaces galore.
  • Multiple layout & styling options.
  • And a couple more… Here’s another nice overview of some theme framework features.

Based on that above list of features (or can we call it criteria) which would make Canvas a fully-fledged theme framework, this would be where Canvas would be:

  • It’s already very customizable (see), even though many of our users aren’t necessarily customizing it using child themes.
  • Canvas sports a massive variety of backend customization options & design controls (see: Painting in Canvas).
  • It’s got 7 widgetized spaces, 36 different layout combinations (6 width options & 6 column layout options) as well as a magazine & business template (along with the other standard page templates that come with WooThemes).

The only things that are missing from Canvas (compared to the criteria list) is hooks & filters. Canvas currently has 27 hooks, but no filters; so it’s not far off from being a complete theme framework, but adding more filters & hooks would make it much easier to publish child themes too.

Is that making more sense? How does this info influence your suggestions on the Canvas as a Framework post? Is this what you want from Canvas?

We’re not saying that this is the perfect route for Canvas, in fact we’re undecided & happy to take some guidance from you in this regard. We just want to develop Canvas in such a way that would make your job as web developer / designer / webmaster easier and enable you to add more value for your clients. So shoot with those suggestions! :)

Tags: , , , ,

48 Responses to “Theme Framework? Huh?”

  1. Hannah
    3 September 2010 at 5:28 pm #

    I would definitely use Canvas if it were developed into a full theme framework; it’s the perfect theme to use for something like this. I don’t have any suggestions other than what was posted before, though. I can’t wait to see what happens with this! :)

  2. Scott Webb
    3 September 2010 at 5:31 pm #

    I’m going to be straight out honest and say that “filters” confuse me. Where can I see an example of framework and filters?

    • Magnus
      3 September 2010 at 6:37 pm #

      Filters confuse me to :) You can see examples above in the provided links.

  3. Phil Derksen
    3 September 2010 at 6:24 pm #

    I’m just now getting heavily into WordPress programming, and I’ll need to get into a theme framework soon that I can tweak for very specific site designs and layouts. Since I’m already a huge Wootheme and Canvas fan, I’d love to see Canvas go this route.

  4. Thomas
    3 September 2010 at 6:34 pm #

    A theme framework has enough built in options that a talented coder can make it look like anything s/he wants. And that framework is documented.

    I think documentation, really good documentation, may not be in the check list that determines if something is a “framework” but it does determine if a framework is useable.

    I also think a framework should be modular. I.e. if I want to add shortcodes, I should be able to open the “shortcode.php” file and add them, and how to add them should be documented.

    I also think being built on some sort of CSS grid framework is important for rapid development.

    • Magnus
      3 September 2010 at 6:40 pm #

      Adding shortcodes is documented in the WP codex and I don’t see any good reason for documenting existing WP functionality.

      You should also always add any functions to either your child or parent theme functions.php like our tutorial on customizing says.

      CSS grid frameworks like 960.gs were used in earlier themes, but they lack the ability to be highly customizable and not very user friendly if you don’t abide by the rules of the grid.

      • Carlos Takemura
        4 September 2010 at 9:05 am #

        On the contrary, I think Woo should document existing WP functionality in the context of your themes. Don’t have users flitting between your docs and those on the WP Codex.

        • Magnus
          6 September 2010 at 12:08 pm #

          We could do a tutorial on how to add custom shortcodes, but there are so many tutorials on Google if you just do a search, that I don’t really see a big value add, but will keep it in mind.

  5. Michael Lovelock
    3 September 2010 at 6:53 pm #

    If it’s to be a parent framework that we can successfully adapt using child themes then unless I’ve missed it (perfectly possible) can there be an easier way to hook into things like the woo_options array to add / remove options without editing the parent theme options file?

    • Magnus
      6 September 2010 at 12:10 pm #

      That was added a while back after a user requested it, so you can now hook on to the options :) http://forum.woothemes.com/topic.php?id=26199#post-121076

      • Michael Lovelock
        7 September 2010 at 2:54 pm #

        D’oh – should have found that! Very nice. Could this function be extended to removing unnecessary options?

        • Magnus
          7 September 2010 at 3:34 pm #

          No, to remove functions you have to move the whole function to your child theme functions.php and modify it there (it will then overwrite the parent theme function).

  6. Nick
    3 September 2010 at 6:54 pm #

    I like this path for canvas – but as suggested, documentation is critical!

    Go for it!

  7. Jay O'Hare
    3 September 2010 at 7:11 pm #

    So this would be another “framework” in addition to the current WooThemes framework?

    • Magnus
      6 September 2010 at 12:14 pm #

      The WooThemes framework isn’t the same as a theme framwork. The WF is the a collection of functions that exist in the /functions/ folder of all our themes, where we put all functionality that should exist in all themes.

      A theme framework is a theme built to aid rapid development of child themes, so you don’t have to rewrite the basic loops and template code every time.

      Yes, it is a bit confusing ;)

      • Justin Tadlock
        8 September 2010 at 1:59 am #

        I would consider the WooThemes Framework an actual theme framework and Canvas an advanced parent theme built off that framework. I regularly use the WooThemes Framework and Carrington as examples of what “real” theme frameworks are.

  8. James Lee
    3 September 2010 at 7:29 pm #

    Here are some of my thoughts:

    I can drop a mullet loop on my blog by editing index.php, but a framework might have that built into controls for me. I can’t easily mod other loops that are available (definitely have to hack the files to do it), a framework might automate that.

    I can mod my comment section by digging into the CSS, but a framework would have that built into option panels (gravatar size, gravatar location, even post formatting, odd post formatting, and author-post formatting).

    I haven’t figured out yet how to get at the “Read full story – Comments { # }” yet, a framework should simplify that.

    The fact that you have 27 hooks is almost irrelevant to me. I asked about help or tutorials on hooks in Canvas, and I was referred to Google and the WordPress Codex. I’d rather see some Canvas specific documentation, and preferably a user panel similar to what KingdomGeek did in the theme specific plug-in he wrote called OpenHook, which made hooks so ridiculously easy, even I could figure things out on the first try.

    If you don’t have access to OpenHook, please let me set up a test site so you can play with it. It’s that good. Drop me a line at http://jrlee.me or on the Woo Forums.

    …and like everyone else, I’m still scratching my head on filters. They do what?

    Child themes are not intuitive for me. I’m working through it, but right now I have a modified functions.php and index.php sitting in the Canvas folder, and my other mods are in the child folder, and I haven’t figured out what might go wrong when I start moving them around. So far, it’s been a struggle. Not sure how you fix that, so this paragraph might be useless. Still, DIYthemes has an easier solution when it comes to theme customization. I don’t have to go mod a bunch of files with Thesis, I only have to mod two… and I don’t have to worry about how to tweak them when I update the theme. Sorry to bring them up, but that’s my paradigm because I started there first, and while your stuff is much more user friendly on the options panel, when you go beyond the option panels, I get a little lost.

    I’d rather be lost here than there, mind you. ;-) My point is that child themes for me are hard, and perhaps a theme framework would make them easier.

    • Magnus
      6 September 2010 at 12:18 pm #

      Child themes are harder to grasp, and good documentation should help to make it easier to understand, so I hope we can improve that too in the future.

  9. James Lee
    3 September 2010 at 7:31 pm #

    Oops – meant to also mention an easy path to full width frameworks. :-D

  10. kirkoconnor
    4 September 2010 at 5:40 am #

    About 6 months ago I started working with a theme framework from one of my theme suppliers.

    Whilst initially it was difficult to “get it” and I thought I had lost a lot of flexibility, once I understood what was going, on I never want to go back to modifying parent themes again. It is too time consuming and you have no real protection against future WP upgrades killing your theme.

    This is a must for WooThemes to remain at the forefront of WP theme development and, for me, I certainly want a second supplier that is competitive in terms of the technology they provide.

  11. Carlos Takemura
    4 September 2010 at 8:35 am #

    @Adii You state the following about Canvas:

    “It’s already very customizable, even though many of our users aren’t necessarily customizing it using child themes.”

    This should be telling you something!

    Make it easier for people to customize before you start talking about hooks and filters ;-)

    • Kerry
      4 September 2010 at 2:00 pm #

      The developers using it sometimes aren’t the people building it. Although the flexibility of Canvas is much better than other themes (I was really excited to see this), as someone (non techy) trying to set up the flexibility it is confusing.

      If you want people to have so much flexibility, you need to provide them with logical steps to create that. At the moment the backend is a series of sections and people have no idea where to start and no idea of what the impacts of their choices are.

      • Magnus
        6 September 2010 at 12:21 pm #

        I see the key point going through these comments is that users would like to see more documentation on how to customize Canvas, both through standard options and child themes. We will try to improve and add documentation on this.

  12. shawn
    4 September 2010 at 9:57 am #

    framework suggestions.

    1. visual editor
    –check out
    http://gsoc2010.wordpress.com/daryl-koopersmith-visual-css-editor/

    Take it beyond just css editing into full column creation visually. Kind of how builder or ithemes does it.

    2. custom post-type/taxonomy creation with auto single/archive page template creation. Take care of the url rewrites on the theme level.

    –tie the newly generated pages into the visual editor.

    3. custom loop generator

    –Now that we have new custom post-type setup with your plugin, and we can visually edit the page, we need to be able to place custom loops on the page to pull in the new content.

    *The custom loop generator should also be visual, and allow the admin to choose which tax fields to display and where to display them within the loop.

    4. drag-n-drop modules such as custom post-types into templates.

    –Yoothemes

    5. simple hooks

    –Go beyond simple hooks and make them a part of the visual editor as well.

    6. woo search should be extended so that if a new custom post-type/taxonomy is added, that those fields are automatically added to the search parameters, thus making woo custom search usable. Asking users to figure out how to modify the estate search via code is only asking for troubles. A very low % of users would have a clue how to do this even with directions.

    7. Proper font attribute engine like thesis.

    –simply changing the color/size/font is not enough, looks tacky. What about the line/letter spacing formula that should be changing for each change made? It’s no wonder why thesis fonts look so much better than just about any other theme out there. Really there is no comparison.

    8. Additional modular theme plugin toys that can be dropped in like sliders.

    –must have ability to modify the loop and use sliders throughout the site using separate loops should the user want to.

    9. Front end editor

    –until 3.1 or God knows when.. it would be nice to have a front-end-editor that is auto created allowing whatever custom post-types/taxonomies that are registered in the theme to be used for each section.

    *video would have its own editor using fields relevent to video, same for audio, or whatever post-types the user creates.

    10. XML Configurable

    Everything you see in the Settings and Styling tab is configurable via the config.xml file. For example, if you don’t want to see the font-size option, simply delete that line in the config file. Of course you can add more if you want to.

    *basically a visual form that allows the user to add/subtract options from the theme-options.php panel. User chooses new field/type to add without having to touch code.

    Here’s a concept:

    Pretend for a minute that you guys don’t know how to code all that well, but want to build a website. Say it’s not just a blog, but a site that has:

    -shopping cart
    -blog
    -custom video layout
    -custom audio layout
    -user submitted testimonials
    -geo mapping

    and to make it a bit more difficult, you want each section to look different from the others.

    Now, how are you going to ask your mother to build this site writing very minimal code if any at all?

    Build me a framework that does that, and I think you have succeeded.

    **Finally, I know one would look at this and say ‘most of that is plugin territory’.

    IMHO I disagree. A strong case can be made that every option I have listed above is a good candidate for themes as so much functionality is now included in each theme. Kind of the entire concept behind functions.php and its extensions.

    • James Lee
      5 September 2010 at 3:16 am #

      +1 to all… really well stated.

    • Magnus
      6 September 2010 at 12:26 pm #

      Lots of cool features there, some a lot more complex than others :)

    • Magnus
      6 September 2010 at 12:34 pm #

      Most of these are feature additions though, and not something that will make Canvas more of a framework (under the definition that most know a WP theme framwork).

      • Carlos Takemura
        7 September 2010 at 11:44 am #

        Well, perhaps that definition needs to be redefined!

        People aren’t interested in semantics, they want tools to enable them to build their web businesses easily with minimum fuss.

        Maybe build a framework that meets most people’s ‘expectation’, rather than following a definition that means nothing to those of us with less technical abilities.

        • Magnus
          7 September 2010 at 2:11 pm #

          We hear you, and that is what we intended with Canvas. What we are asking here though, is if our users want us to make it more like a standard WP theme framework.

          • Carlos Takemura
            8 September 2010 at 10:34 am #

            I understand but judging from the other commenters here, I’m not sure they care if it’s a standard WP theme framework if they’re still not able to do the stuff they need to do.

            Your Estate theme, for example, is too restrictive and would require massive amounts of customisation to get it do what I want, but would it be worth the effort if you’re planning to make it more flexible in the future anyway? Probably not from my point of view.

            May as well hire someone to build a custom framework from scratch and not bother with such generic themes, which sometimes feels like we’re trying to fit a square peg in a round hole. Actually, fitting a square peg in a round hole is often easier ;-)

            I urge to look at the work the guys at YooThemes have done.

  13. shawn
    4 September 2010 at 10:13 am #

    Continuing…

    Have you ever asked yourself what your customers have to go through to build ‘estate’ using canvas?

    –I’d love to see how you would try to write that article….

    What if the same user wants a woo shopping cart and city-guide geo locations on their site as well as a few other custom content types?

    What if the same user wants each section to look different from the other sections?

    Should not a framework be capable of doing this without asking the user to know how to write very complex code?

    Give a user the ability to do this, and you have created a ‘true’ framework.

    **Believe it or not, most of the tools needed to do this already exist. The problem is no one has combined all the needed tools together into one coherent complete framework system.

    • Carlos Takemura
      4 September 2010 at 10:28 am #

      @Shawn Excellent stuff! Your comments above make me wish the guys over at YooThemes would port their framework and tools over to WordPress – the sooner the better; we’d be flying!

    • Magnus
      6 September 2010 at 12:32 pm #

      To be honest, I don’t know what a user has to go through to build Estate using Canvas.

      But to ask you the same question: Have you ever asked yourself what we have to go through to allow users to mix functionality from different themes?

      It would require a lot more time to develop, a lot more manpower, a lot more testing etc not to mention a lot more support.

      That being said, we ARE trying to make our new functionality more modular so we can use them across themes.

  14. Martin
    4 September 2010 at 11:16 am #

    I think Shawn has just nailed it on the head for me. I was beginning to think I am different – keeping it simple to use without sacrificing flexibility is key. And more robust documentation, video tutorials, and, er, help.

    I’m actually comfortable with xhtml & css, but as James pointed out earlier, rather than ad-hoc hacks to code, especially the css, why not have this more configurable within the framework.

    The world is moving on and I need quicker more cost effective sites. And that’s where I hope you come in. Canvas could be just what I need to cut down on the time it takes to build solutions.

    Yes to e-commerce and all the other great ideas.

    I actually need community tools – but if a membership system means using an alien plug-in, reliance on third-party plug-ins is a big concern for me due to upgrade operability and security reasons. If a client suffers hiccups, its manageable. If a community suffers from hiccups, it becomes a volcanic erruption where brands can be ruined.

    My big problem is – I came into this by seeing WooThemes first, I’m not even familiar with WordPress! I love the previous suggestions, I love the idea of Canvas and further extension, but I’m sure I can’t be alone in being confused if ‘help’ topics either don’t exist or fall off the page and take me into a different planet.

    I would willingly pay for one-to-one telephone support, if you were to offer it. For me I need answers about what I need to know to get a result, which might mean a bit of WordPress wizardry too, rather than having to trawl through support files, or worse still – using a forum which can take far too long to get half an answer becasue I didn’t know how to frame the question properly.

    What I would say is that I am very impressed by the professionalism of WooThemes – and there are not many online service providers these days that manage to do that!

  15. Mansoor
    4 September 2010 at 1:23 pm #

    I have to agree with Shawn as well… If you deliver canvans in the the way he has described it I will stop complaining for good.. (for few months at least!!)

  16. dave
    6 September 2010 at 5:07 am #

    I’m not sure I understand the fine details of what makes something a framework or not… but the way I would like to use canvas is as the basis, or foundation, for easily customizable sites. In other words, I would like to start with Canvas, and via clean coding and built in features, have an easy time adding and editing things to make just about any site I’m working on.

    If that is close to what a “framework” is, then my comments below will be relevant… if it isn’t, then maybe they won’t.

    1. CSS: The last time I tried to use Canvas as the foundation of a site, I found the order of the CSS calls to be hard to get around. It seemed like the style sheet for called first, then custom, and THEN anything specified in the Admin Panel. The Admin Panel over-riding custom.css made it very hard to tweak and customize the theme to the degree I needed. The only solution was to disable the Admin Panel, which of course, limits the utility of the theme as a foundation. Fixing this, re-arranging the calls, whatever, would be helpful.

    2. Child Theme: I found it very hard to use a child theme the last time I tried. In part, because of the CSS problem above.

    3. Complicated coding: I imagine this makes development a lot easier, but constantly creating custom functions and burying them further and further into the themes directory structure makes edits and tweaks harder than normal. When I customize Canvas I almost always have to first track down and map out the function calls. A lot of times it is not obvious where the code for certain functions resides.

    • Magnus
      6 September 2010 at 11:40 am #

      Hi,

      1. Canvas loads styles in this order: style.css, user styles from admin, custom.css

      2. When using a child theme you should disable all options output in header (there is an option for that)

      3. The reason we do this is so we can make it easier and faster to do changes and customizations, although the learning curve is steeper on how to modify it, as you can’t simply modify the template files correctly. That is the biggest problem for beginners when using a framework.

  17. Rico
    9 September 2010 at 9:58 am #

    Awesome idea!

    Here is something I’m missing today:

    Add an option to choose between a fluid and a boxed layout. For example, I’d like to skin the nav bar to go across the complete width of the page, similar to the Headlines theme. Sames goes for the content, header, and footer containers. I think the Headway framework lets you do something like this. I’d love to see this in Canvas, too!

  18. Frank McClung
    9 September 2010 at 6:19 pm #

    I echo many of the same thoughts here, especially Shawn’s. I think there are plenty of pure frameworks available now (Hybrid, Carrington, Thesis, WP Framework) that there isn’t much of a need for another one. The real need is on the front end–to make things easier for non hard core developers to put together layouts in WP and customize the theme. Headway and Carrington Builder have taken some big steps in this area. There’s much room for improvement and a lower price point.

    I would love to be able to use a visual editor in Canvas (like Carrington Build or Headways) to layout a site (custom homepage, pages, posts, post types, etc.) and then fill those containers in with the content and functionality types (widgetized functionality modules from different Woo Themes). At that point I can style the CSS as I like. Canvas would be the perfect tool to create mash-ups of Woo themes for a specific client site.

    • Vickie
      13 September 2010 at 8:44 am #

      Completely agree Frank and would love an easy way for non-dev’s like me to create custom layouts.
      I love Canvas and seeing what people have done with it but it’s not easy to customise unless you’re a coder.

  19. Eddie Gear
    13 September 2010 at 11:57 am #

    I use Headway as a Framework, that is excellent with its innovation. However there are still alot of features that needs to be enhanced to improve user experience.

    • Eddie Gear
      13 September 2010 at 11:59 am #

      Please build something that a user can build from scratch without anything on the whiteboard. I know you guys are really talented. Thanks. Cheers.

  20. scb
    15 September 2010 at 4:17 am #

    - Hire a coder. You probably have one, so fire him and hire a good (decent) one. For a million dollar company, whoever writes your code seems like a stupid monkey. Checkout woo_image() in your admin-functions.php if you don’t believe me. I understand WooThemes doesn’t sell code, you sell the way it looks. It’s ok, but you don’t have to be a genius to understand what “code reuse” means.

    - Once you do that, move the code to a plugin. I don’t use only one WooThemes template, I use multiple templates. I would like the customizations I make to a theme function be used all over my templates (for example, making woo_image less stupid).

    - Every single time I have to edit a theme that is *not* Canvas I seriously start dying inside. Why do I have to edit at least 3 files to change how my loop looks like? Seriously, I don’t love actions, but they are used beautifully all over Canvas. Again, hire somebody who understands what code reuse means… if you don’t believe me, check most of your themes: at least index.php, search.php and archive.php are the same thing with a condition to check if there is a post that matches. If I want to change something I have to edit those files (sometimes more) to change the way it looks. Actions solve this for the general case and the particular case (wanting to display something only sometimes).

    I might come up confrontational, but seriously editing WooThemes’ theme has been one of the most frustrating experiences while using WordPress.

    • Adii Rockstar
      15 September 2010 at 7:11 am #

      It’s hard to take such an offensive comment seriously. Ever tried calling someone a “stupid monkey” to their face? Didn’t think so…

  21. Dave Evans
    7 October 2010 at 6:45 am #

    scb was bit harsh, but I agree with the sentiment. I have 8 years of blog posts based on 4 major platform changes, countless hours invested in poking around under the hood. At one point I was a consultant for Movable Type. I’ve worked with at least 25 themes and a few platforms and recently become tired of Thesis theme. I tend to agree that there is a lot of focus on presentation and not clean code but thats not the real issue here.

    Designing a theme should be like opening up Adobe Creative Suite and banging out an ad for a magazine. No code, 100% GUI. Pagemaker was doing this what, 25 years ago? Not apples to apples comparison but we need a full GUI to customize or build our own themes.

    And then there is the SEO issue. Lots of gorgeous themes, but the SEO stinks. See Posterious and tumblr as examples.

    The problem with themes in general is that we either spend $1,500 with a designer, or “settle” for a $50 theme. Basically what Frank said above.

    that said, I’ll probably drop the dime and buy the WooThemes subscription, if anything I like this thread a lot and it’s a bit less newbie-ish than the Thesis crowd and some of the other forums/threads I’ve read.

  22. Matthew Guay
    9 October 2010 at 5:49 am #

    Would the new features be added as an update to Canvas, or will this be a separate theme? That would influence my purchasing decisions, so if the new features are planned as updates for Canvas then I would feel great to go ahead and jump in with the current one for now…

    • Magnus
      9 October 2010 at 10:24 am #

      These would come as new features to Canvas :)