Блог

Я создаю тему wp с использованием Redux framework, WP-Less для компиляции стилей в LESS. Работа в PhpStorm.

Теперь я хочу динамически изменять некоторые цвета из Redux и передавать их в мой основной стиль.меньше файла, который будет скомпилирован в style.css.

Проблема в том, что когда я хочу загрузить свой css, мне НУЖНО сделать это с помощью

 wp_enqueue_style('my-style', get_stylesheet_uri());
  

но он загружает только css, а не мой файл less. В моем functions.php файл, в котором я определил свои переменные.

 add_filter('less_vars', 'my_less_vars', 10, 2);
  

функция my_less_vars($vars, $handle)
{

 Redux::init('redux_qmakeup');

global $redux_qmakeup;
if (isset($redux_qmakeup['opt-typography']['font-family'])) {
    $font_name = $redux_qmakeup['opt-typography']['font-family'];
} else {
    $font_name = 'Montserrat';
}
if (isset($redux_qmakeup['opt-typography']['color'])) {
    $font_color = $redux_qmakeup['opt-typography']['color'];
} else {
    $font_color = '#d6451e';
}
if (isset($redux_qmakeup['opt-color-footer'])) {
    $footer_color = $redux_qmakeup['opt-color-footer'];
} else {
    $footer_color = '#414243';
}

// $handle is a reference to the handle used with wp_enqueue_style()
$vars["font-family"] = "'$font_name'";
$vars["font-color"] = "$font_color";

$vars["footer-color"] = "$footer_color";

return $vars; }
  

В документации WP-LESS говорится, что теперь я могу использовать @footer-color в моем файле .less, и PhpStorm скомпилирует его автоматически. Но это не сработает, компиляция будет прервана, потому что мой @footer-color не определен. И если я определю его как пустой var, он не будет использовать мой redux color, но сохранит этот пустой var.

Вы используете WordPress filter add_filter(‘less_vars’, ‘my_less_vars’, 10, 2); чтобы добавить ваши переменные less.

Я использую Netbeans, и я уверен, что в PhpStorm то же самое. Компилятор Netbeans не может использовать фильтры WP, просто так. Вы не можете использовать компилятор PhpStorm для компиляции, если все переменные не записаны в файлах less.

Одним из решений является компиляция файла с использованием WP-LESS только тогда, когда у вас есть некоторые изменения в файлах или переменных less (которые будут изменены после изменения некоторых связанных с ним параметров темы).

Надеюсь, это поможет 🙂