On WordPress Theme Frameworks

I’m in a bad mood today, so I’m gonna do a little whining about WordPress theme frameworks, okay? Don’t be surprised if I delete this post in a day or two ;)

I was reading this post on WPBeginner, where Syed writes that you can edit your theme’s header.php file, and add a stylesheet for a Google Font in your theme. Then he writes about “the right way” to do it in the Genesis theme framework:

add_action( 'genesis_meta', 'wpb_add_google_fonts', 5);
function wpb_add_google_fonts() {
    echo '<link rel="stylesheet" type="text/css" href="http://fonts.googleapis.com/css?family=Lora|Oswald" media="screen">';
}

Okay, so here’s what I don’t understand. Why on earth should a theme framework way of adding a stylesheet file, differ from the WordPress way to do it?

I spent years and years and years, studying the massive amount of WordPress actions and filters, and by now I’m aware that if I’d like to output something in my theme’s <head> section, I’d simply use a child theme functions.php file, or a plugin file (I wouldn’t edit my header.php), and hook to wp_head to print my link elements, voila!

Now if I choose to use Genesis (or any other theme framework for that matter), it’s supposed to make my life easier, right? Well no! Now I have to spend more and more years to study another billion actions and filters names, so I know that if I’m using Genesis, I have to hook to genesis_meta instead. This is crazy, and the reason why I don’t use any WordPress theme frameworks. Please don’t come and tell me your framework is different and I’m gonna love it, because I’m not.

Oh and in case you were wondering, the right way to include a stylesheet into your WordPress theme would be to use the wp_enqueue_style function.

Phew, I feel much better.

About the author

Konstantin Kovshenin

WordPress Core Contributor, ex-Automattician, public speaker and consultant, enjoying life in Moscow. I blog about tech, WordPress and DevOps.

39 comments

  • Konstantin, I totally agree with you. wp_enqueue_style function should always be used. That is what I tried doing first as suggested by Nathan Rice, in StudioPress’s article about Google Fonts. Except Google clearly states, that the font styles should be loaded before anything else. Using wp_enqueue_style and then printing them using wp_print_styles, this was printing the item after the main stylesheet was already loaded. That was the reason why I had to hook into genesis_meta() hook.

    Anyways, totally agree with your thoughts. I shouldn’t have had to do that. I created a post about this in SP’s forum, but got the reply saying “this has been already debated. The developers have chosen to go the @import route because its simpler for integration”…

    So I had to do this work around.

    Using a framework does help in some cases, but it definitely has its downsides. For ex. once you know these hooks, you can fairly easily code out a child theme in a matter of a few hours.

    The downside is that there are things like this where its hard to modify anything.

    Thanks for dropping by on the site and leaving a comment. Always good hearing from you.

    • Hi Syed, thanks so much for your comment, I really appreciate it! Here’s how I see it: if Google says the fonts stylesheet should be loaded before the rest of your stylesheets, then let’s do as Google says:

      wp_enqueue_style( 'google-web-fonts', 'http://fonts.googleapis.com/...' );
      wp_enqueue_style( 'my-stylesheet', get_stylesheet_uri(), array( 'google-web-fonts' ) );
      

      It’s pretty self-explanatory I hope, check out the dependancies argument in wp_enqueue_style.

      You would also have to use this if you’d like to publish your theme to the WordPress.org themes directory. Here’s a quote from the guidelines:

      Themes are required to enqueue all stylesheets and scripts, using wp_enqueue_style()/wp_enqueue_script(), and hooked into an appropriate hook via callback function, rather than hard-coding stylesheet/script links or tags in the template.

      In any case, Syed, this post was not meant to be about Google Web Fonts and how to use them, but rather about how much I dislike WordPress theme frameworks :)

      Thanks again for your comment, hope you’re having a terrific Wednesday!

  • I use the Genesis theme on a lot of projects, and I never use @import. I always use wp_enqueue_scripts like a good little WordPress dev :D
    I did a few theme reviews and at the time, the only hardcoded stylesheet allowed was the main style.css.
    But thanks for the tip of also enqueuing the main stylesheet and making it dependent on the Google Fonts one. neat!

  • Just wanted to leave a quick note to say thanks for challenging us. I’m planning on revisiting all of this today with Nathan and want thank you and Syed for bringing this (back) up to our attention. Stay tuned. ;-)

    • Hi Brian, it’s so kind of you to come here and comment, I really appreciate it! Even though I’ll probably never use (nor understand) Genesis, keep up the great job! I heard a lot of good stuff about your products, so don’t let my whining get in your way too much, I’m just having a bad day, that’s all :) Cheers and thanks again for stopping by!

    • Nathan and I have made a commitment to including WordPress best practices as much as we can for our users.

    • Having used Genesis, it’s … well not useless for someone who knows their way around themes and coding, but it’s less useful. If you’re a newbie, you pretty much get stuck with how a theme works. With Genesis, there’s a lot of Dashboard editing you can do (and with plugins, you would never have to touch a child theme, all your settings would be there).

      So I see why it, specifically, exists the way it does. It’s a managed theme framework, and the importance is on ‘managed.’ Everything is in the WP Dashboard, and y’know, sometimes I think that’s perfect ;)

    • Hi Mika! Thank you for your visit :) and thanks for clarifying that up, though I must say that some friends of mine (like David and Paul here) are really experienced and good WordPress developers, yet they tend to stick with Genesis. Perhaps it does make some things easier for them, which is why I think it is a great product.

      Even if there is something a framework can easily do, I’m almost certain it won’t take much longer to do with bare WordPress. And if there’s no way, I’ll dig up the core files and find a way. And if I don’t find a way, I’ll file a core ticket and create a way :) Boom!

      Anyway, thanks for stopping by. Have a great day!

  • The only challenge I see right now is with the Genesis Framework parent theme itself, which we’ll probably leave the @import method in the style.css file. We really can’t include the wp_enqueue_style function itself in the Genesis functions file, because then it will be applied to all of the child themes. I have tested the method you suggested in your comment above, and can confirm that it works.

    • Sounds good, though honestly, I don’t have much clue of what you’re talking about :) Paul and Syed, as Genesis users, are probably better to weigh in on this. Also keep in mind that get_stylesheet_uri will return the child theme’s stylesheet, so it’s kind of a million birds with one stone, but you probably know all of this already, so I’m gonna shut up now :)

      Thanks for your comment!

  • This is the very reason I don’t use frameworks. I know WP; I don’t want to have to learn someone else’s modifications to WP. Annoying.

    That being said, for the average user, frameworks are probably great.

  • Hi Konstantin!
    Why bothering? Of course, you can hook into wp_head if you’re running Genesis — the genesis_meta hook is additional and can also be used. You should more blame WPBeginner for a “bad” tutorial and not Genesis here.

    It’s the true nature of such a framework to provide additional hooks and filters that’s what’s it all about.

    Also better to not write about Genesis stuff if you’re never used it and not knowing what you’re talking about.

    Sorry, such posts are useless and irritate users, not very helpful at all.

    • Hi David, thanks for stopping by! I wrote before that I have no clue about Genesis or any other theme framework whatsoever. Don’t be upset, but I think you missed the whole point of my thoughts out loud.

      The wp_head thing is just the tip of the iceberg, and when I write about genesis_meta I’m actually referring to this whole hooks reference. Now, saying that “of course you can hook into wp_head instead” in this case sounds very much like “obviously you can use wp_remote_get, but here’s a curl_init reference for you instead.” Which makes me wonder about existence of theme frameworks even more :)

      I know you guys love these frameworks and everything, so I really don’t want you to take things personally. If it makes your life easier — awesome, use it! I never said the framework is bad, I just said that I don’t like it and I won’t use it.

      Sorry, such posts are useless and irritate users, not very helpful at all.

      No worries, this post wasn’t meant to be helpful at all :) Cheers and thanks for taking the time to come by and comment!

    • Thanks for clarifying – I was irritated by the post title, really… To me your post and title sounded like: all frameworks do it wrong, especially Genesis — that’s not the case! You have to check case by case with every other theme too! (Most frameworks ARE parent themes, technically!)

      I would never use wp_head for that, always wp_enqueue_style etc. – that’s also very clear. Don’t get me wrong here, you can use 99% of WP stuff with Genesis, and the small extra part is only if you want to use some Genesis bonusses – but you don’t have to if you want only WP standards…
      What I mean you can use all WP stuff with Genesis – most special Genesis things are template-wise (because of some wrapper functions etc.).

      In my opinion, a framework like Genesis really speeds things up, with development and client work — they’re constantly improving and I am sure it will have some improved stuff for Google Webfonts in next release what extends/replaces the currently used @import in child stylesheets. Most other frameworks or parent themes I tested don’t do this. I am a Genesis guy for over 2 years now and from my experience nothing better could happen to my daily work and business. Just my 2 cents.

      The other thing is wrong tutorials out there or some with wrong code parts in it! There are also some Genesis developers or people from the community fighting this but you will always see other people mix things up and share code snippets which are very wrong. The same with WP itself and other themes, frameworks etc.

      Thanks, Dave :)

    • Dave, my friend, sorry for the wrong impression you got there, never meant to make it sound that way :) I can keep repeating it over and over — Genesis is a great product! It’s just not for me.

      I also never meant to say anything bad about Syed’s tutorial, either of the three ways will work, and most people won’t really care anyway, whether it’s an @import, or a link, and whether it’s embedded via wp_enqueue_style or not :)

      So let’s chill out okay? This is just me, just saying that I don’t like the whole idea behind WordPress theme frameworks, that’s all. I don’t believe this post got so much attention. I was expecting like 1-2 “you suck!” comments haha!

      Cheers mate!

  • I used to work with theme frameworks that offer a lot of filters and hooks, but I never got used to it. My idea of a WordPress framework is that it should be consistent in using the stuff the WordPress framework itself already offers you in terms of UI and code.

    Just my five cents ;-).

    • Thank you Silvan, for your five cents! My idea of a WordPress framework is that it shouldn’t be a framework, but a core patch instead. Just my five cents ;) Thanks for your comment!

    • Nice, thanks for sharing your post @pri2sh, I’ll have a read. I also have a very different religion about SEO and tend to never use, what claims to be “SEO friendly.” I even stopped using @yoast’s SEO plugin in favor of my own.

      Cheers and thanks for your comment!

  • I couldn’t agree more Konstantin! I can understand completely why some people use frameworks cause it’s a good way to start if you’re using WordPress themes and child themes and modifying them but I think sometimes these frameworks end up losing touch of what core is capable of and they end up overcomplicating things.

    I’m actually going to be part of a Q & A panel at WordCamp Sydney in July and it’s all about frameworks. I’m gonna be the odd one on the panel cause I’ll be talking about using Twenty Eleven and _s as a framework cause I love doing things the core way cause I find them simple and effective. I’ll be the black sheep of the panel of course :)

    Every time I’m asked for help from someone who uses a framework I’ll think to myself that I’ll be able to help them fix it in under 10 mins because I know how to do it the core way…I have lost count of the times where I have ended up having to work out why their framework is intercepting actions and filters before my function is called.

    That being said, as you can tell by the comments, Brian is the most proactive when it comes to frameworks so you know that any issues with Genesis will be fixed in no time :)

    • Hi Bronson, thanks for your feedback! I would really enjoy to watch that Q&A panel, hopefully on WordPress.tv, and best of luck to you my friend :) lay some ground rules and make sure you don’t get in a fight too haha!

      Also, please don’t use _s as a framework. It’s meant to be a starter theme, not a parent theme. Copy, search and replace and start building your own theme out of _s. Check out the getting started section for more info.

      Cheers and have a great Wednesday!

  • Surprised no one has mentioned, while you’re entitled to your own opinion about frameworks, you are as far as I can tell incorrect about the “right way” to include a stylesheet. That Codex page you linked to is outdated.

    You shouldn’t be using wp_print_styles, rather wp_enqueue_scripts.

    • Hi Michael, you must have missed something, I never even mentioned wp_print_styles, only the wp_enqueue_style function. If you think the Codex page has some outdated info, you can always edit it and make it better. Thank you for contributing to the WordPress project! And thanks for your comment :)

    • Heh, I realize I can edit the wiki just like the next guy, saw several links to your post, saw you link to “the right way” and on that page, loading stylesheets in WordPress themes, it uses the wp_print_styles hook and *_enqueue_style.

      That is incorrect information, just as the Genesis tutorial you called out is probably not the best way to accomplish the goal.

      (p.s. I updated that wiki page)

  • Hi Konstantin! Perhaps I’m flogging a dead horse here, but as David pointed out Genesis already follows best WordPress practices. The plethora of hooks and filters the framework contains merely enhances WordPress, takes it above and beyond.

    I purchased the Pro-Pack a couple of years ago and just recently started building child themes and haven’t looked back. Admittedly there is a learning curve. I’m hardly a coding expert but I’m catching on. For someone such as yourself, it would be a snap. :)

    Anyway, my 2 cents. Thanks for the read.

    • Thanks for your input Len, the learning curve is what I’m actually worried about. I’d rather spend that time learning something I don’t know about WordPress (and trust me, there’s a lot) but I get your point. Thank you for your comment!

  • Thanks to all for this discussion. I’ll offer my perspective on theme frameworks from another angle: as a front-end designer-sorta-developer-but-not-really…

    Frameworks are obviously immensely useful, as gauged by their popularity. When I first started working with WordPress, frameworks were just coming into wide use. I took a long look at Thesis & Hybrid, and while I recognized that there must be a lot of value there, I just couldn’t wrap my head around actions and filters. I read and read, but somehow the concept just didn’t penetrate my brain into any kind of workable process. As a designer, I’m super comfortable with HTML and CSS as they are quite transparent: I can easily conceptualize how the markup will translate into a visual design. Not so with “real” code. Only after spending a lot of time with Twenty Ten and Twenty Eleven, and building my own themes from scratch, have I really gotten a feel for how WordPress works.

    I liken it to my early days of web design: the choice was between using a WYSIWYG tool like Dreamweaver, or learning to write HTML and CSS. Dreamweaver was a powerful tool in its day, allowing a designer to quickly craft a website. But without understanding how “real” markup worked, the designer was locked into working exclusively with that tool.

    Here’s an example of why frameworks are so frustrating to me, from a designer’s standpoint. (I’ll use Hybrid as an example, just so we’re not all picking on Genesis.)

    Say I wish to see how the entry title is displayed in singular.php. Hybrid creates the before_entry action for me, and if I look that up I see that I get the entry title, byline, and entry meta inserted before the content. If I want to see how entry_title is rendered, I have to hunt it down: I find it in functions.php, and turns out it’s a shortcode, so I need to go to shortcodes.php to see the output. The entry title shortcode is nicely set up with some conditionals, and if this output works for me, fine. But if it’s not the way I want to display the title, I have to figure out how to change it. And really, it’s strange: I’m editing singular.php, but my entry title is still running through this global shortcode, even though I could simply change how the title shows up in the single template, if I was writing my own theme.

    And if I want to move something from the before_entry, I have to unhook it and hook it up someplace else. But doesn’t that change it everywhere, since before_entry is global? And if not, how do I conditionally change the output without hacking the core files? I’m sure that a real WordPress programmer can figure this out easily, but I’m just a poor designer, with rudimentary cut-and-paste skills.

    Again, this is only my experience. For me, figuring out how the framework has decided how to do something, then figuring out how to override it if I need to, is frustrating and exhausting. I’ve made much more progress using the default themes as the basis for study and creating my own custom themes. And yes, I finally figured out how to use actions and filters… ;-)

    • Howdy, great to know your opinion, much appreciated! I never used Hybrid, but I’m sure it’s a great product and Justin’s doing an awesome job, but yeah, nobody can avoid that learning curve, except Justin :)

      I think there’s a bigger advantage in just spending that time to build your own starter theme, and making it better with every project you work on. If it’s easy enough for others to understand you can open source it, like _s was open sourced, and see if people can benefit from it.

      However, if the starter theme requires a book to read, an actions and filters reference, a paid support forum and two bottles of tequila… thanks, but no thanks :) P.S. I think your Dreamweaver comparison is a bit unfair, otherwise I’d have to ditch WordPress and be a rouge PHP developer :)

      Cheers and thank you for stopping by!

  • On a completely unrelated note, Konstantin: I read quite a bit on the iPad, and I noticed that I cannot pinch-to-zoom your pages. The text here is somewhat small and low-contrast, so it is rather difficult for me to read your posts. Would you consider removing “maximum-scale=1” from the viewport settings?

    • I would consider increasing the font-size for tablets and phones, thanks for the feedback! I never actually looked at my own site through the iPad, so maybe it’s time to give it a try :)

    • Thanks for considering my idea. If you simply remove the max-scale part of the viewport meta, then that allows users to pinch-zoom a page. I find that 90% of the time that’s all that’s needed to make a page more readable.

  • Let`s talk about using and not using frameworks in different live situations. Why do you need to invent a wheel? It`s not about write or wrong way of embedding a style-sheet, it`s about getting work done. I prefer to use Canvas from Woo for most of my projects, but of course not for all. The simple reason for that is awesome support, documentation and knowledge base.