> WP LESS to CSS wordpress plugin resources analysis

WP LESS to CSS wordpress plugin resources analysis

Download This Plugin
Download Elegant Themes
Name WP LESS to CSS
Version 1.0
Author Bass Jobsen
Rating 0
Last updated 2013-12-07 02:33:00
Downloads
372
Download Plugins Speed Test plugin for Wordpress

Home page

Delta: 0%

Post page

Delta: 0%
WP LESS to CSS plugin has no negative impact on PageSpeed score.

Home page PageSpeed score has been degraded by 0%, while Post page PageSpeed score has been degraded by 0%

WP LESS to CSS plugin added 903 bytes of resources to the Home page and 887 bytes of resources to the sample Post page.

WP LESS to CSS plugin added 0 new host(s) to the Home page and 0 new host(s) to the sample Post page.

Great! WP LESS to CSS plugin ads no tables to your Wordpress blog database.

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.

Screenshots

Resources added by plugin to Home page/Post page in kB
Total size of resources for Home page/Post page in kB
Random Theme Tests
No screenshot

Unknown Theme

by: @unknown

0
0%
Profession screenshot

Profession

by: w3creatives

5363
0%