Roots is the most popular Twitted Bootstrap-based WordPress starter theme from developer Ben Word. After building nearly a hundred sites using Roots, I’ve learned a lot about the theme and decided it’s time for a review.
Building with Roots today is a lot different from just one year ago. That’s a good thing. It means the developers of Roots are consistently adding and improving features to optimize how developers work with the theme. This is my review of Roots and its features.
Starter Theme, not Framework
Many people confuse Roots as being a framework rather than a starter theme. I’ve gotten lambasted a few times for not creating a child theme off Roots. Why, I ask? The theme changes so dramatically over time and it’s not meant to be a framework.
Child Themeing with Roots: Don’t Do It
The developers of Roots don’t think you should build child themes from it. In fact, it’s been discussed whether Roots should just completely drop child theme compatibility. And I’m fine with that.
A main purpose of Child themeing is the ability to upgrade the parent theme easily. Most times with Roots this won’t be that easy. So you’re better off not doing it. Use the starter theme for what it is and build off it, not under it.
Roots: Not Just a Twitter Bootstrap Theme
If you think Roots is just a Bootstrap starter theme, you’re wrong. There’s a lot more going on under the hood than you may think. Sure, you are able to create a child theme under Roots but what good is that? In a few weeks, maybe months, you’ll be slamming your head on the desk trying to figure out what went wrong when you upgraded the parent theme.
The Roots Wrapper extends and complements the WordPress template hierarchy. Most WordPress themes are WET (Write Everything Twice) whereas Roots is DRY (Don’t Repeat Yourself). In your typical WordPress theme you will see multiple repeat wrappers across various template files thus going against the DRY principle.
Enter the Theme Wrapper:
The goal of a theme wrapper is to remove any repeated markup from individual templates and put it into a single file.
Roots does this through a single file in your theme called
base.php. You can expand and extend this to your needs and it works very well. What I do not like about it though is it doesn’t always play nicely with popular plugins such as Events Calendar by Modern Tribe or WooCommerce. There is a simple workaround, but in a perfect work it would work with these popular plugins out of the box.
Clean URL Rewrites: My Love Hate Relationship
Half of me likes the cleaner URL rewrites that Roots has out-of-the-box. By ‘clean’ I mean URLs are root relative without all the
wp-content junk cluttering it up. Some people may not give a hoot what their URLs look like, but I do. As well, it also removes some of WordPress’ unnecessary meta tags.
The issue is though, many hosts don’t support the redirects for clean URL rewrites that Roots serves up. What’s this mean? Well, you’re going to have to manually create them yourself and many times this isn’t that easy.
If You’re a Novice, Say No to Roots’ Clean URL Rewrites
I’ve moved many Roots-based sites from traditional Apache hosts to Managed WP hosts like WPEngine and Flywheel. These hosts don’t typically play very nicely with Roots’ rewrites. If you want to preserve your URL structures you have to manually create redirects and it isn’t always straight forward.
Changing WP’s Uploads directory to Assets
Another feature of Roots is to change your uploads folder to assets in your base WP install directory. At first I thought this was a good thing for my site. As time went on though my assets folder continued to accumulate thousands of files and navigating it became a huge pain.
Many WordPress developers I’ve spoken have seen Roots do this and were appalled. WHY!? That’s like killing kittens! Just. Don’t. Do. It! Drawing from my experience, I agree. Don’t change your uploads directory.
Grunt Built In: Yes, Please
Prior to using Roots, I didn’t use Grunt. Roots adopted Grunt a few months back (from this writing) and got me to start using it. I thank them for that. Grunt has modernized my workflow and I have Roots to thank for that. Recently, Composer has been coming up more and more with Roots and I imagine soon I’ll check that out too.
Roots helps keep your development workflow cutting edge. It has many of the latest goodies packed in it and that’s one more reason to use it.
CSS Preprocessor: LESS
I love the frontend. For awhile I was resistant to adopt a preprocessor into my workflow. I figured, what’s the use? It just spits out CSS in the end? Roots helped me see the light and now I’m loving LESS. I’ve used SASS as well, and yes you can also use SASS with Roots. There are a number of notable forks out there if you like SASS over LESS. Basically, Roots helped shift me into using CSS Preprocessors. Again, another reason why I love Roots: it helps keep my development modern and fresh.
Roots Theme Pro Con Summary
If I had to pick a few items I like a dislike about Roots then here they are:
- Actively Developed
- Theme Wrapper
- Grunt / LESS / Bootstrap
- Easily Extended / Modified
- Lots of Forks
- Not WP Theme Test Compatible
- jQuery from CDN
- Rewrites can be a headache
- Grunt and LESS may be unappealing to some
- Popular plugin (WooCommerce, bbPress, Events Calendar) incompatibility out-of-box
Summary: Non-Traditional but Cool… Give Roots a Shot
Unlike other WordPress starter themes, Roots provides more to start with in developing your project. Bootstrap gives you a framework to build robust and responsive applications and HTML5 boilerplate, microformats and WordPress code cleanup ensures your markup is clean.
Some WordPress developers may prefer starting with a little bit more while others may prefer to create their setup themselves. Roots starts you off on a certain path. You can choose to stay the course or modify it to your liking, that’s the beauty of Roots.