Tonight I have been tweaking my custom CSS and I noticed a rather cool setting. It turns out that you can write LESS or Sass directly into the CSS stylesheet editor that is available to WP.com users with a paid upgrade or to WP.org users via Automattic’s excellent Jetpack plugin.
The WordPress CSS editor is already very good, with syntax highlighting, tab support and lots of other nice touches. Through this window it is possible to radically overhaul the look and feel of your WP.com blog, and being able to use a CSS preprocessor here will really help keep things simple and nicely organised.
For example, by using variables you can simply define some colours at the top of your document and then adjust the colour scheme of your whole site. From that point forward you can change the entire scheme again simply by tweaking those variables. Variable alone should convince any designer that preprocessors might be worth looking into. Once you’ve learned about mixins, operations and functions too, the chances are you’ll never look back.
Personally, I picked LESS because it was easier for me to get started with. For WordPress purposes both languages start on a more equal footing, and more advanced users than me usually seem to prefer Sass. I don’t think there’s a ‘wrong’ choice here.
- Infuse your CSS with Sass and LESS – en.blog.wordpress.com
- Browse posts tagged LESS and Sass on decodering.com, my HTML/CSS linkblog on Tumblr. I’ve collected loads of cool tools and resources here.
- Some very cool WordPress plugins – A recent post on this blog.
- Sass vs. LESS – css-tricks.com “Which CSS preprocessor language should I choose?”