This plugin helps you to build and maintain your website with LESS.
Author: | Bass Jobsen (profile at wordpress.org) |
WordPress version required: | 3.6 |
WordPress version tested: | 3.7.38 |
Plugin version: | 1.0 |
Added to WordPress repository: | 07-12-2013 |
Last updated: | 07-12-2013
Warning! This plugin has not been updated in over 2 years. It may no longer be maintained or supported and may have compatibility issues when used with more recent versions of WordPress.
|
Rating, %: | 0 |
Rated by: | 0 |
Plugin URI: | https://github.com/bassjobsen/wp-less-to-css |
Total downloads: | 1 270 |
Active installs: | 20+ |
Click to start download |
This plugin helps you to build and maintain your website with LESS. LESS is a dynamic stylesheet language.
LESS extends CSS with dynamic behavior such as variables, mixins, operations and functions.
This plugin is build with: LESS.php
Profits
- No extra checks (server time) to load your lastest CSS
- LESS editor for small changes or child themes
Examples and usages
wpless2css/wpless2css.less will be your master LESS file. Add your LESS code here or import other LESS files.
All LESS files should be place in wpless2css/
for now.
wpless2css/wpless2css.less could contain simple or more complex LESS code like:
p{color:red;}
Or more complex intergrate Twitter’s Bootstrap’s CSS:
- Download the latest version from:
- Copy all *.less to
wpless2css/
-
edit
wpless2css/wpless2css.less
@import “bootstrap.less”;
Load Glypchicons:
- Copy all
/fonts/
to your web server -
edit
wpless2css/wpless2css.less
@import “bootstrap.less”;
@icon-font-path: /fonts/;
**Note:*: Go to the settings and save settings after changing you LESS code to create a new CSS file.
If you website or theme is primary Bootstrap based condsider to use Custom Bootstrap Editor.
Theme developers
Call wp-less-to-css.php
from your functions.php to bundle the plugin:
require dirname(__FILE__) . '/vendor/wp-less-to-css/wp-less-to-css.php';
Save the CSS (conditional) automatic by adding to your function.php:
$updatecss = WP_LESS_to_CSS::$instance;
$updatecss->wpless2csssavecss();
Only save the CSS on changes. Compile a new CSS every time your page loads will make your site slow, but you can use it for testing.
Use the save action after changes via the customizer for example:
add_action( 'customize_save_after', 'lesscustomize' );
function lesscustomize($setting)
{
//$setting is no used here, see also: http://stackoverflow.com/questions/14802251/hook-into-the-wordpress-theme-customizer-save-action
$updatecss = WP_LESS_to_CSS::$instance;
add_filter( 'add_extra_less_code', 'add_extra_less_now_live');
function add_extra_less_now_live($parser)
{
return 'a{color:'.get_theme_mod( 'heading_color').'} p{color:orange;}';
}
$updatecss->wpless2csssavecss();
}
Depending on your needs wpless2css/wpless2css.less
can be moved from root to the theme or child theme directory (wp-content/themes/{yourtheme}/wpless2css/wpless2css.less
).
Contribute!
If you have suggestions for a new feature or improvement, feel free to contact us on Twitter. Alternatively, you can fork the plugin from Github.
Requirements
- WordPress tested with >= 3.6
Support
We are always happy to help you. If you have any question regarding this code. Send us a message or contact us on twitter @JamedoWebsites.