Установка приоритета таблицы стилей дочерней темы

Question

Установка приоритета таблицы стилей дочерней темы

23 февр. 2016 г., 18:13:50

Просмотры: 38.1K

Голосов: 6

Я создал дочернюю тему, и основной файл style.css работает отлично. Однако в родительской теме есть еще одна таблица стилей, которую я хочу импортировать и создать аналогичную для дочерней темы и использовать вместо неё.

Структура родительской темы - ./woocommerce/woo.css
Структура дочерней темы - ./woocommerce/woo.css (Создан вручную)

Сейчас я подключил обе таблицы стилей в functions.php дочерней темы следующим образом:

function fruitful_load_parent_stylesheets() {
    wp_enqueue_style( 'layout', get_template_directory_uri() . '/woocommerce/woo.css' );
}
add_action( 'wp_enqueue_scripts', 'fruitful_load_parent_stylesheets' );

function fruitful_load_child_stylesheets(){
    wp_enqueue_style( 'woo', get_stylesheet_directory_uri() . '/woocommerce/woo.css');
}
add_action('wp_enqueue_scripts', 'fruitful_load_child_stylesheets');

Теперь, когда я добавляю стиль в файл woo.css дочерней темы, он не работает, пока я не добавлю !important. Я просто не хочу добавлять его к каждому стилю, который я добавляю.

как это сделать?

nimsrules

208

дочерняя тема wp enqueue style css

Комментарии

Пожалуйста, ознакомьтесь с этим комментарием

Mayeenul Islam

23 февр. 2016 г. 18:40:45

Все ответы на вопрос

Возможно, стоит попробовать добавить значение приоритета для каждого add_action, чтобы гарантировать, что один выполнится раньше другого.

add_action( 'wp_enqueue_scripts', 'fruitful_load_parent_stylesheets', 10 );
add_action('wp_enqueue_scripts', 'fruitful_load_child_stylesheets', 20 );

WordPress Codex add_action()

goalsquid

91

23 февр. 2016 г. 19:20:47

Комментарии

Не сработало. Вот ссылка на скриншот inspect element - http://i.imgur.com/Mb34NJa.png

Третий блок из woo.css дочерней темы, а первые два — из родительской. Не понимаю, почему они загружаются дважды.

nimsrules

23 февр. 2016 г. 19:53:31

Установка приоритета сработала для меня. Мне пришлось установить его выше 10, чтобы он "переопределил" enqueue родительской темы.

Gavin

22 мар. 2018 г. 17:07:20

у меня тоже - теперь я могу переопределять настройки родительской темы (купленного шаблона)

cljk

25 мар. 2020 г. 12:49:20

Комментарии

Это сработало после того, как я закомментировал подключение woo.css в functions.php родительской темы. Принимаю этот ответ. Спасибо!

nimsrules

23 февр. 2016 г. 20:32:35

Я загружаю дочернюю тему позже, как показано ниже. Мне пришлось убрать стиль родительской темы из очереди и снять его регистрацию, затем снова добавить стиль родительской темы в очередь и добавить стиль дочерней темы. Надеюсь, это поможет.

Родительский functions.php содержит:

add_action('wp_enqueue_scripts', 'load_parent_style', 10);
function load_parent_style() {
    wp_enqueue_style('parent-theme-style'); // код родительской темы
}

Дочерний functions.php содержит:

add_action('wp_enqueue_scripts', 'load_child_style', 20);
function load_child_style() {
  // регистрируем и добавляем в очередь родительский стиль с новым именем
  wp_register_style('parent-style', $url, array($deps));
  wp_enqueue_style('parent-style'); 

  // убираем из очереди и снимаем регистрацию стиля родительской темы
  wp_dequeue_style('parent-theme-style'); // из родительской темы
  wp_deregister_style('parent-theme-style'); 

  // регистрируем и добавляем в очередь стиль дочерней темы
  wp_register_style('child-style', get_stylesheet_uri(), array('parent-style'));
  wp_enqueue_style('child-style');
}

Vemman

41

17 мар. 2018 г. 17:08:07

Charles 2.29K · Accepted Answer · 2016-02-23T20:23:53Z

Стили вашей дочерней темы (stylesheet) обычно загружаются автоматически. Если этого не происходит, вам также потребуется добавить их в очередь (enqueue). Указав 'parent-style' в качестве зависимости, вы гарантируете, что стили дочерней темы загрузятся после родительских.

/**
 * Подключение стилей темы (сначала родительские, затем дочерние)
 * 
 */
function wpse218610_theme_styles() {

    $parent_style = 'parent-style';

    wp_enqueue_style( $parent_style, get_template_directory_uri() . '/woocommerce/woo.css' );
    wp_enqueue_style( 'child-style', get_stylesheet_directory_uri() . '/woocommerce/woo.css', array( $parent_style ) );
}
add_action( 'wp_enqueue_scripts', 'wpse218610_theme_styles' );

Примечание: дополнительную информацию можно найти в Руководстве разработчика тем.