Roots 7.0.0 Updates

Roots 7.0.0 was released today! The new release features a much improved theme development workflow.

Development started back in Feburary and, after a lot of feedback and help from the Roots community, is finally ready. This new version introduces Bower for front-end package management, better LESS organization, and a new Grunt workflow.

What's new

Leaner Roots

Some features in Roots have been moved to a plugin called Soil, including:

  • WordPress markup changes/clean up
  • Nice search
  • Relative URLs

These features are enabled in lib/config.php, and can also now be used in any other WordPress theme.

Bower for front-end package management

Bower is now being used to pull in Modernizr, jQuery, Bootstrap and Respond.js to assets/vendor/. Whenever you're adding front-end assets to your project, you can use bower install <package> to add them to the vendor directory.

We're also now using grunt-modernizr to make a lean build based on what tests you use in your styles and JS.

LESS organization

LESS files are organized differently, see #961 for details. tl;dr:

├── components
│   ├── _buttons.less
│   ├── _forms.less
│   ├── _media.less
│   └── _wp-classes.less
├── layouts
│   │── pages
│   │   └── _home.less
│   │── _footer.less
│   │── _general.less
│   │── _header.less
│   │── _pages.less
│   │── _posts.less
│   └── _sidebar.less
├── _bootstrap.less
├── _global.less
├── _variables.less
└── main.less

Grunt workflow

Previously, every time you updated your CSS or JS (or minified files), changes to lib/scripts.php had to be committed to the repo. The repo no longer includes any generated front-end assets. Grunt tasks are now split into: dev and build.

  • dev: runs JSHint, compiles your LESS (non-minified) and concatenates your JS.
  • build: task runs JSHint, compiles and minifies your LESS, runs UglifyJS for concatenation and minification, generates a lean Modernizr build, and revisions CSS and JS based on the hashes.

During build, assets-manifest.json is generated with the names of the revisioned files. lib/scripts.php reads that file and tells WordPress the correct path to the assets.

What's next

If there's anything you'd like to see, please reach out to us on the Roots Discourse.

Subscribe to 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?

Follow @rootswp on Twitter