Today we are announcing our first WordPress plugin WP-SCSS, a lightweight plugin designed to compile your sass files into css on the fly. And we made sure to refine the code for use with any wordpress theme. Not sure what sass is or how it can change your life? Maybe you’ve never heard of Compass? Check out our primer “Why it’s time you used Sass” to whet your whistle.
Usually working with a precompiled language like Sass means working locally with command line tools or a compiling application. But sometimes there are cases where you need to work from a live server, like making a few quick changes without creating a dev environment, or building the front end while the client adds content to a staging server. Whatever the reason, WP-SCSS makes it really easy to use sass without requiring a local dev environment.
Simply install like any other wordpress plugin and configure the settings by defining your scss and css folders in your theme. The plugin takes any .scss files it finds in your defined directory and compiles them to your designated css folder. We’ve even added the option to automatically enqueue the compiled css files into the header for you!
The idea of compiling sass on a live environment isn’t exactly ground breaking. But this is the first plugin that uses the modern php compiler scssphp and features a full settings panel to get you started quickly. Moreover, the plugin includes error reporting to help you debug errors during compiling. You can also choose to show these errors on the front end or send them to a log file depending on your site’s current status.
The plugin is still a work in progress. As such, this initial version has limited Compass support as compiling Compass with php isn’t a straightforward science. However, for the time being you can manually import Compass files for limited support in your projects. Here’s an example of how that would work.