LESS CSS Plugin

The LESS CSS Plugin allows Pixelsilk to parse LESS files and output CSS files. For more information about LESS, see its website and documentation.

Enabling the Plugin

The "LESS CSS Plugin" must be enabled before it can be used on your site. See Enabling Plugins for more information.

Usage

the LESS CSS Plugin allows *.less System Files on your Pixelsilk site to also be read at *.less.css. Reading this .less.css file will read the compiled LESS as CSS.

Note that syntax highlighting is not present inside *.less files in Pixelsilk. You may want to use an external editor that supports LESS syntax highlighting.

Example

Let's create a LESS file named style.less:

add-style-dot-less.png

Then we'll edit its contents with a simple LESS stylesheet, and save it:

style-dot-less-contents.png

Next, let's view style.less in the browser:

style-dot-less-browser.png

Note that this is simply the LESS source we wrote before. Now let's view the style.less.css file in the browser:

style-dot-less-dot-css-browser.png

You'll see that the LESS has been compiled in to valid CSS, ready for insertion into a page! For example, we can insert this into a style tag:

<link rel="stylesheet" href="/style.less.css" />

Limitations

The LESS CSS plugin cannot use the JavaScript expressions that LESS supports.

The LESS CSS plugin does not support the data-uri function for embedding images in CSS stylesheets.

Importing

Other *.less or *.css files may be @imported from the system files on the same Pixelsilk site. External files may not be @imported.

Back to Plug-ins »