I’ve been working with Shopify.com for some time now. One of the(many) cool things that Shopify has going for it, is the TextMate bundle they offer. It really makes writing Shopify Liquid code much nicer.

If you’ve ever working on a Shopify theme, you’ve most likely delt with a .css.liquid file. It’s a CSS file that contains a tiny bit of liquid code (mostly for linking to assets like background images). By default, TextMate will treat these file like liquid files. They really should be treated as CSS files.

To fix this, in TextMate, press cmd+option+control+L. This will open the “Bundle Editor”. Expand “CSS” in the navigation pane on the left.

In the right window, find:
fileTypes= (

Add “css.liquid” to that list. Look at the below image for an example.

 Restart TextMate and you should be read for some Shopify CSS goodness.