Using Sass compressed output while leaving theme comment header for Wordpress Using Sass compressed output while leaving theme comment header for Wordpress wordpress wordpress

Using Sass compressed output while leaving theme comment header for Wordpress


SUPER SHORT VERSION: Use /*! loud comments */ and compile the SCSS just before packaging and distributing.

Two part answer, "old part" first:

I used Sass/SCSS when developing my "Orin" theme: https://github.com/founddrama/orin

Part One:

  • In my src/scss directory, I keep all of my _include.scss files and the style.scss file that has all of the @import statements.
  • During development, I just run the usual sass --watch (although it's an extra step to remember to save the style.scss file).
  • Once your SCSS source is looking good and committed to version control, you can simply build the style.scss into style.css and check that into version control for the Theme that gets distributed.

In my case, "Orin" is just for me, so I perform the build when I update it on the blog server, but the SCSS compilation can just as easily be done prior to packaging/distribution. The build script I'm using is here (in that Github repo); the gist of it being:

  1. touch to create the style.css output file;
  2. apply the license text;
  3. compile the SCSS and append it to style.css.

Part Two:

More recent versions of Sass include support for /*! loud comments */; meaning that I need to get off my lazy butt and update to:

  1. Include the license text and theme description right there in style.scss using the loud comments;
  2. update the build/deploy script to simply compile the SCSS.


Well, i would suggest you to use Compass . The comment should look like this:

/*! A loud SASS comment */