Hello, all! My name is Zack Philipps, and I’m the Development Team Leader at Tribeswell. I’ve only written one other blog post, and it was more accurately a tutorial. So, I guess this could be considered my first real blog post. Sweet!
I wanted to write about the custom workflow we’ve been developing for over a year at Tribeswell. It’s important to note here what kind of website design firm we are. We have been around for five years and are growing at a rapid pace. We have had somewhere around 150 clients, with the majority of them coming to us in the last two years. When you get busier, you must become more efficient. Sometimes, drastic changes in operations are necessary.
We pretty much develop exclusively on the WordPress platform, and in Tribeswell’s early years we had always used either free or purchased WordPress themes and customized them with child themes. If you’re a WordPress developer and you’ve ever used this method, you know how much of a pain it is to make sure your changes are being put in the right place, to track down the templates or styles that you want to change, etc.
To combat this, we had started to use Bones, the WordPress starter theme. So we were becoming familiar with CSS preprocessors like Sass and LESS, and we loved every minute of it. We were absolutely ecstatic to have found something more custom to work with. “Custom” is a word we throw around a lot at Tribeswell. Having found no evidence to the contrary so far, we believe the more custom, the better.
So, it stands to reason that eventually, Bones wasn’t custom enough for us. We were still having to strip out way too much template code, still having to override way too many styles. It was around this time that we had also invested in a DigitalOcean VPS instead of expanding our reseller plan with HostGator. In discovering DigitalOcean’s vast expanse of incredibly helpful tutorials, and the ridiculous speed improvements our new sites were enjoying, we became even more obsessed with customization and minimalism.
One day, my boss Colin simply turned to me and said, “We should just make our own completely custom WordPress theme.” I had already been developing an SCSS framework and encouraging others to use it. He powered through several Treehouse tutorials in the course of an afternoon and had the beginnings of template files in place. I combined it with my SCSS framework and something was born.
Quick Google searches of “minimal wordpress theme”, “blank slate wordpress theme”, and “zero wordpress theme” revealed that all of these names were taken. However, “Scratch Theme” was not, and lo and behold: scratchtheme.com was available to purchase.
The next major thing that happened was my discovery of Grunt, the JavaScript task runner. It can do all sorts of things, but my main areas of interest were SCSS compilation and minification, JS concatenation and minification (I wanted to serve just one script file and just one stylesheet, both minified), and image optimization. When I discovered the added benefits of automatic CSS vendor-prefixes and live refreshing of the site across all browsers and devices, I was definitely hooked. I then became obsessed with eliminating as many WordPress plugins as possible from our workflow. It was much better to let Grunt handle the work those plugins were doing, because it ensured that every script and style would be built in to the “one stylesheet and one script file” end result. Plus, Grunt and its modules offer very useful debugging tools, source maps, and much, much more.
Soon, plugins that Grunt couldn’t replace began dropping like flies. Icon fonts plugins? Just build them in. WP Google Fonts? Just add @imports to your SCSS files. Google Analytics? Just add the code to your <head>. Some random snazzy JavaScript plugin? I bet it could be incorporated more efficiently. These types of plugins don’t really save any work for you, but they do make your server work harder.
After that, it was just a matter of stepping back and figuring out which tools we used frequently enough to warrant including them on every Tribeswell website. Due to the massive optimizations we had started implementing, we could afford to use some overhead. We had fallen in love with Ionicons, Magnific Popup, Glide.js, jQuery Waypoints, and Velocity.js, so we simply built them in to Scratch.
And, that’s how Scratch was created. We have changed it so drastically so many times in the course of its development that we are calling today, August 1st, 2014 the day of its initial release: Version 1.0.0. It’s been a labor of love and we know it will continue to be. Whether you’re a Tribeswell client, a WordPress developer, or simply a satisfied viewer of a Scratch-powered site; we hope you will enjoy the benefits of Scratch as much as we have enjoyed creating it.
Interested in reading more? Check out the Scratch Theme homepage, documentation, changelog, and GitHub repository.
The post Custom WordPress Theme Framework: Scratch by Tribeswell appeared first on Tribeswell.