Getting Sassy

I can’t believe I’ve only just discovered sass. Sass is a preprocessor for css that makes editing your site’s style much more manageable. It includes things like variables and scoping that makes editing style a lot easier. Sass can then be compiled to normal css and used in any website.

I decided to design a new theme based on Underscores which happens to have support for sass. I work on Windows so I found installation with the Chocolatey Package Manager the best option. The only thing I needed to do was add dart.exe to the PATH after installation as it wasn’t installed automatically.

On Windows I’ve found Visual Studio to be really good for editing themes. You can just open your theme’s folder as a project. It’s not a fully feature PHP IDE but it’s doing the job for now. It’s also easier to use than Eclipse on Windows. I may invest in something like PHPStorm in the future if I start getting into more heavy WordPress development that needs full on debugging.

Now I can modify my theme using sass and I can just run the following command in my theme’s folder using PowerShell:

sass .\sass\style.scss .\style.css

And it generates a readable css file. As long as you have WordPress set up to minimise and cache (preferably via CDN) that’s all you need to do and it works great.