Sage 9

Just like Bootstrap 4’s recent final release 🎉, Sage 9 is finally out of beta after years of development!

Thank you to everyone who helped contribute to Sage 9 by using it and reporting issues, contributing code, helping others out in the community, and for sticking around while we worked towards this release. 💚

The Sage documentation will help you get started, or you can go ahead and run composer create-project roots/sage your-theme-name to get started with Sage 9 right away.

What’s new in Sage 9

  • Bootstrap 4, Bulma, Foundation, Tachyons. Or no CSS framework! You’re no longer tied into any specific CSS framework out of the box.

  • Laravel’s Blade as a templating engine. Check out the templates directory to see what it looks like if you aren’t familiar with Blade. Currently, you can opt-out of Blade templates by replacing them with regular PHP ones (you could copy over the templates from Sage 8 if you really wanted to). We’re looking into making this optional in the future.

  • Replaced gulp and Bower with Webpack and npm. Bower is pretty much dead at this point, and the packages you’re used to pulling in with Bower should also be available on the npm registry. We’re using Webpack to handle automatically resolving assets from 3rd party packages, as well as for compiling assets, optimizing images, and concatenating and minifying files.

  • Modern JavaScript. Not familiar with the new features in JavaScript? Wes Bos’ ES6 for Everyone is one of the best resources for learning modern JavaScript. Use Lebab to convert your existing JS to ES6.

  • PSR-2 coding standards. Roots projects switched to PSR-2 last year. Previously we had used a modified PSR-2 ruleset, but we stopped caring about 2-spaces in our PHP files and fully adopted PSR-2.

  • Restructured theme files. All theme templates are finally out of the theme root! Our implementation is a little hacky because a 8 year old WordPress Trac ticket still hasn’t landed, but we believe our implementation is the best we can do at this time.

  • Introduced Yarn. Yarn is a drop in npm client replacement. With Yarn, the installation of Node dependencies is quicker & the node_modules directory is smaller.

Theme Development with Sage: 3rd Edition

Not sure where to start with all of these new updates? The third edition to the Sage book is also available and covers Sage 9!

The book update includes 2x the amount of content as well as ePub support and a website for viewing it, along with the PDF.

Join the discussion on Roots Discourse

Join over 5,500 subscribers on our newsletter to get the latest Roots updates, along with occasional tips on building better WordPress sites.

Looking for WordPress plugin recommendations, the newest modern WordPress projects, and general web development tips and articles?

“Easily the best WordPress email I get.” Colin OBrien

Ready to checkout?