Recently I’ve begun messing around with LESS. I was kind of forced into it because we’re starting to use it at work, and in order for me to edit those sites I need to know what I am doing. My coworker pointed me to a few articles to help me get started, plus Developer Drive is doing a “Learning LESS” series.
- LESS: The dynamic stylesheet language
- LESS Is More: Make Your CSS Coding Easier with LESS
- An Introduction To LESS, And Comparison To Sass
- Learning LESS: An Introduction
- Learning LESS: Variables
After reading those articles I was sold. The mixins and the variables are what really got me excited because they eliminate a lot of repetitive coding. Plus, you can do so much!
The tricky part about learning all of this for me was not so much how to code in LESS but rather working remotely with LESS files. LESS is all about editing locally, but we have to edit live sites at work. Everyone at work uses Dreamweaver to code/FTP and SimpleLESS to compile LESS files on their Windows machines, so it works well for them.
I, however, use Transmit and Coda to manage sites on my Macbook Pro. While I found a compiler plugin for Coda, I discovered it evolved into the LESS.app, and I couldn’t find any real clear directions that told me exactly what I needed to know.
Instead I had to experiment with a couple articles that were mainly geared towards CodeKit. I found an article, Working Remotely with CodeKit & LESS, and used that to figure out how to get it working for me with Coda and Transmit.
So, here is how to edit LESS files on a live site via Transmit, LESS.app and Coda.
- Open Transmit and LESS.app
- In Transmit, mount site as disk
- Navigate to the folder where your less files are. For me, it was my “library” folder within my theme
- Drag that folder into the LESS.app
- Begin editing your files in Coda
Once I figured that out, everything else was easy. Using LESS has completely changed the way I code, and I’m loving what I am able to do so far. LESS is definitely more!