Bryan, I'm glad you like it. However we don't plan on extending the concept to other areas.

This is a great tool. Are there any plans to extend this concept to other areas of the system, such as Web Parts CSS?

Just putting this here for anyone having issues importing files - make sure you:
A. Leave off the extension (.less) in the code name
B. Do not use periods (.) in the code name
C. Do not use dashes (-) in the code name

WORKS:
@import "yourlessfilename"

WILL NOT WORK:
@import "yourlessfilename.less"
@import "your.less.file.name"
@import "your-less-file-name"

Just spreading the knowledge.

Hi Juan,
Unfortunately, there is no way to upgrade Less stylesheets for v7 to Less preprocessor for v8 directly as these are a different kind of product whose are not mutually compatible. Less stylessheets for v7 is rather like an additional module whereas Less preprocessor for v8+ is an integration with the existing CSS stylesheets application. Your existing Less stylesheets are not lost, you can still find them in customtable_LessStylesheet table.

Hello,

I was using Less on my Kentico 7 version.
Now, after the upgrade to 8.2.4, do I need to uninstall the old Less version and then install the new one for K 8 ?
Can you tell us the right procedure to do it ?

Thank you

Hi,

When importing my supporting stylesheets, it was found that you CANNOT HAVE A PERIOD (.) IN THE CODE NAME of the file you're trying to import!

Hopefully this saves others a little time with troubleshooting.

All-in-all, this product is great! Love that I can easily bust out some LESS CSS and keep everything nice and organized. Great job as always, Kentico!

Thanks!

ONDREJ,
I think what I did wrong was initially I was importing with the full path and file extension of the .less files. Since I was actually calling on .less files (incorrectly) I needed the mime type for the server to access them. So you are correct, when properly importing you do not need to touch the web.config file. In my haste to get started with LESS in Kentico I overlooked the details for importing other LESS files within the CMS.

On a new topic, I am finding that it would be nice to be able to denote which LESS files are Root files and should be compiled, versus helper files that are imported into the root and should not be compiled to CSS separately. For example I have 7 .less files that are imported into one root file. One of those imported files contains my common variables. If I try to save other files that reference those variables into the CMS then I get 'variable undefined' errors. My solution has been to store my helper .less files outside of the CMS. That way only the root file is compiled and it pulls in the helper files at compilation.

Another option is to import my variables file into each of my other files that reference it. I decided against this since it wasn't important for me to have all of my code within the CMS. I'm using my own version control anyways so having the files outside of the database works fine.

Hi,

I have fixed the issue reported by Ryan (resolving URLs against current domain). Please install the latest hotfix (8.0.12] and then you need to download and install Less preprocessor package again to solve the problem.

Justin,

Actually, ".less" MIME type isn't needed at all because, in fact, no files with ".less" extension are requested on the server. Does the server error you mentioned occur everytime you save style sheet that uses @import statement?

Ryan,

If you modify helper style sheet then you also have to manually re-save the main style sheet. This is by-design behavior (also mentioned in instructions file) however I admit it might be quite inconvenient. I will consider to add this feature in the next version. Regarding your issue with resolving URLs against current domain, I'm gonna have a look at it and I will let you know ASAP.

ONDREJ,
I'm not sure if the server error was something wrong on our end since we did a multiple-step upgrade from 5.5 to 6 to 7 and finally to 8. Perhaps on a clean Kentico 8 install the LESS mime type already exists and our older config files did not account for them? Either way it was adding that mime type that fixed the 500 error.

Regarding the @import, I realize I was doing it wrong at first. I was improperly pointing to the path of the virtual files rather than using the code name. I discovered the correct import syntax and got it fixed.

Otherwise I'm with Ryan in that changes to imported helper LESS files are not compiled into the master file until I re-save the master file (I think I even had to check it in too). This currently presents a challenge as I just broke my styles out into 8 separate sheets imported into a single master LESS file.

I have another issue but I am not sure if it is the LESS compiler or a function of Kentico.

If my LESS file has a class with an entry like "background: url(/images/pin_it.png) no-repeat;" and I am developing from a development URL like http://mydevbox, the compiled file has my hostname appended to the beginning like "background: url(http://mydevbox/images/pin_it.png) no-repeat;" which is not what I want. Is there a way to prevent this?

I noticed that making a change to a helper LESS file does not recompile any master LESS files that @import the helper file automatically. The only way to do that is to open the master LESS file and click Save. Is there a way for the system to recompile any LESS files with @import references to the helper LESS files automatically when the helper files are modified?

ONDREJ,

I downloaded the module from above and it seems to have fixed my issue. I am assuming the DLL files are what changed since the JS files in ~/CMSScripts/CMSModules/CMSLessCss appear to be identical. Thanks for getting this fixed so quickly!

Hi,

Sorry for the long silence. Steve and Ryan were right, there really was a problem with @importing style sheets when CSS minification was turned on. I have re-uploaded a new package where the issue is fixed. I'm sorry about any inconvenience.

Justin, thank you for your feedback but actually I didn't get your point. There are no additional steps (such as allowing .less extension in web.config) required to be able to @import Less style sheets even if they are stored in the file system. Just use the following syntax: @import "<style sheet code name>";. Does it work for you? Or could you provide me more details?

I wanted to share my own experience and minor hurdles getting {LESS} fully working on our Kentico 8 site.

I had no problems getting everything set up and working in general. The instructions were clear and easy to follow. I created a few placeholder stylesheets and was about to start getting into the trenches coding when I hit a snag.

@import "another-less-file";

Importing another less file into my primary .less stylesheet resulted in a 500 error.

After some hunting I was able to resolve the issue with these steps:
1. update my web.config to include the mimetype for .less extensions:
<system.webServer>
...
<staticContent>
<mimeMap fileExtension=".less" mimeType="text/css" />
</staticContent>
</system.webServer>

This resolved my 500 error, but then I had a 404 error instead.

2. I'm using Source Control on my stylesheets and so have them stored in the file system. To successfully import a file I needed to include the full directory path of my targeted .less file:
@import "/CMSVirtualFiles/CSSStylesheets/another-less-file.less";

Things are moving along smoothly now and I couldn't be more happy to be able to use LESS with a Kentico site!

I have verified what Steve posted on Apr 29, 2014. If CSS minification is turned on, the LESS validator does not allow you to save certain file patterns.

For instance, I have a series of LESS files that manage variables, functions, mixins, etc. I use @import (reference) to include these in module LESS files like _footer, _nav, etc. Those compile in the editor just fine. However, if I @import those into a master LESS file called Globals, I get errors. Looking at the request through the Chrome console shows that the modules are coming back minified which seems to cause the LESS compiler to choke. With CSS minification turned off, everything works as expected. I would like to have CSS minification turned on. It would make more sense if the editor never got the minified version regardless of the global setting to avoid these compilation issues.

FYI, you can turn CSS minification off in Kentico 8 at Configuration > Settings > System > Perfomance

I ran into an issue with the LESS Preprocessor in Kentico v8 with CSS minifcation enabled while attempting to import other LESS stylesheets. Once disabled, it worked without issue. If enabled, it seemed to produce syntax errors that would keep the file from being saved.

Hi,

LESS module for version 7 can still be downloaded here: http://devnet.kentico.com/marketplace/modules/less-stylesheets

Cheers