2016-04-07 15 views
0

WordPressでCSSプリプロセッサ(LESS)を実行するには?LESSがWordPressで動作しない

私は子供のテーマでLESSを適用しようとしています。私はvariable.lessを作成し、子テーマフォルダcss/less/variable.lessに配置し、私は、ヘッダー(子テーマ)

<link rel="stylesheet/less" href="/wp-content/themes/themename-child/css/less/variable.less" type="text/css" /> 
<script src="//cdnjs.cloudflare.com/ajax/libs/less.js/2.6.1/less.min.js"></script> 

でこの@import "variable.less"

ように私はstyle.cssにこの.lessを呼ぶが、それは働いていません。

また、私はこれを試してみました...しかし運

function css_less(){ 
    wp_register_script('less-js', get_template_directory_uri() . '/js/less.js'); 
     wp_enqueue_script('less-js'); 
    wp_register_style('less-css', get_template_directory_uri(). '/css/less/variable.less'); 
     wp_enqueue_style('less-css'); 
} 
add_action('wp_enqueue_scripts', 'css_less'); 

のstyle.css

.box-horizontal{ padding: 1em 2em 1em 2em; margin-top: -1em; text-align: center; border: 1px solid #CCC; box-shadow: @box-shadow; background: @bg-white; border-radius: 3px; } 
.box-bg{ border: 1px solid #CCC; box-shadow: @box-shadow; background: #FFF; border-radius: 3px; text-align: center; } 

リンク:あなたは、LESS-コンパイラがインストールさhttp://www.homecredit.ph/testEnvironment/mail-test/4830-2/

答えて

0

を持っていませんか?あなたはLESSをCSSにコンパイルする必要があります。

私はほとんどの場合https://wordpress.org/plugins/wp-less/を使用しますが、利用できるプラグインはもう少しあります。プラグインをインストールした後、あなたがこのようなあなたのfunctions.phpにスタイルシートをエンキューすることができます

function eq_less() 
{ 
    wp_enqueue_style('less-style', get_stylesheet_directory_uri() . '/style.less'); 
} 

add_action('wp_enqueue_scripts', 'eq_less', 99); 

style.lessの拡張子に注意してくださいすることは.lessない.cssです - コンパイラが自動的に拡張子を認識し、そのためのCSSファイルを生成します。エンキューされます。

+1

lessphpも便利です:http://leafo.net/lessphp/ – admcfajn

関連する問題