How to use wp_enqueue_style() in my WordPress theme?

Question

I am building out my first WordPress site for a client. I really want to use LESS for CSS and found a WP plugin named WP-LESS.

Now, I am total WordPress newb, but it appears that this plugin requires me to use a function called wp_enqueue_style() to tell WordPress to process the .less file.

I can't figure out where I use this function. I looked in my header.php file in my theme directory and I see this.

<link rel="stylesheet" type="text/css" media="all"
  href="<?php bloginfo( 'stylesheet_url' ); ?>" />

Am I supposed to replace this code with something like this?

<?php wp_enqueue_style('mytheme',
  get_bloginfo('template_directory').'/style.less',
  array('blueprint'), '', 'screen, projection'); ?>

Answer 1

Not quite, but almost. What you want to do is place a function in functions.php that queues your script.

So:

function addMyScript() {
    wp_enqueue_style('mytheme', get_bloginfo('template_directory').'/style.less', array('blueprint'), '', 'screen, projection');
}
add_action('wp_head', 'addMyScript');

Then make sure you have do_action('wp_head'); in your header.php file and it should work just fine.

Answer 2

wp_enqueue_style usage inside of the theme or the plugin:

wp_enqueue_style( 'my-style', get_template_directory_uri() . '/css/my-style.css', false, '1.0', 'all' ); // Inside a parent theme
wp_enqueue_style( 'my-style', get_stylesheet_directory_uri() . '/css/my-style.css', false, '1.0', 'all' ); // Inside a child theme
wp_enqueue_style( 'my-style', plugins_url( '/css/my-style.css', __FILE__ ), false, '1.0', 'all' ); // Inside a plugin