Дочерняя тема магазина все еще загружает родительский CSS

Question

У меня проблема с дочерней темой Storefront. Я создал дочернюю тему Storefront, как они предлагают здесь: https://docs.woocommerce.com/document/set-up-and-use-a-child-theme/

Дочерняя тема работает нормально, я могу написать свой CSS, написать свой код в functions.php и переопределить файлы шаблонов, но дочерняя тема по-прежнему загружает родительскую тему CSS.

Как я могу создать дочернюю тему без загруженного родительского CSS?

Answer 1

Добавьте эти функции в functions.php вашей дочерней темы.

Этот код отключит загрузку CSS для магазина по умолчанию.

Источник: https://github.com/stuartduff/storefront-child-theme

/**
 * Storefront automatically loads the core CSS even if using a child theme as it is more efficient
 * than @importing it in the child theme style.css file.
 *
 * Uncomment the line below if you'd like to disable the Storefront Core CSS.
 *
 * If you don't plan to dequeue the Storefront Core CSS you can remove the subsequent line and as well
 * as the sf_child_theme_dequeue_style() function declaration.
 */

add_action( 'wp_enqueue_scripts', 'sf_child_theme_dequeue_style', 999 );

/**
 * Dequeue the Storefront Parent theme core CSS
 */
function sf_child_theme_dequeue_style() {
    wp_dequeue_style( 'storefront-style' );
    wp_dequeue_style( 'storefront-woocommerce-style' );
}

Кроме того, вы можете отключить стандартные таблицы стилей WooCommerce,

Источник: https://docs.woocommerce.com/document/disable-the-default-stylesheet/

/**
 * Set WooCommerce image dimensions upon theme activation
 */
// Remove each style one by one

add_filter( 'woocommerce_enqueue_styles', 'jk_dequeue_styles' );

function jk_dequeue_styles( $enqueue_styles ) {
    unset( $enqueue_styles['woocommerce-general'] );    // Remove the gloss
    unset( $enqueue_styles['woocommerce-layout'] );     // Remove the layout
    unset( $enqueue_styles['woocommerce-smallscreen'] );    // Remove the smallscreen optimisation
    return $enqueue_styles;
}

Answer 2

Начиная с версии Storefront 2.5.8, выпущенной 7 июля 2020 года, средства удаления из очереди таблицы стилей родительской темы Storefront обязательно изменились из-за запроса на вытягивание № 1369.

Этот коммит устанавливает таблицу стилей Storefront ( | путь/к/file.css):

• | wp-content/themes/storefront/style.css и
• | wp-content/themes/storefront/assets/css/base/icons.css

как явные зависимости | wp-content/themes/storefront/assets/css/woocommerce/woocommerce.css.

Это изменение было сделано для того, чтобы дочерняя тема могла определяться как зависимость без риска нарушения порядка других таблиц стилей Storefront и без необходимости устанавливать более высокий приоритет для этой поставленной в очередь зависимости для смягчения таких поломок — согласно Issue #1299.

Из-за этой зависимости любая попытка просто удалить очередь таблица стилей (или ) теперь работать не будет (независимо от установленного приоритета). Вы должны сначала переопределить/сбросить зависимости , то с высоким приоритетом любые удаленные зависимости могут быть исключены из очереди.

В приведенном ниже примере;

1. Сначала поставьте в очередь стиль woocommerce только с иконками в качестве зависимости,
2. Затем поставьте в очередь свой дочерний стиль и
3. Наконец, стиль витрины выведен из очереди.

В этом примере я намеренно поставил в очередь свой дочерний стиль после woocommerce, так как я переопределил некоторые стили woocommerce в своем собственном ( если нужен еще более низкий приоритет - я мог бы поместить его в вместо этого функция ). Если бы это было не так, и мой дочерний стиль был просто прямой заменой стиля витрины, я мог бы просто сделать его еще одной зависимостью от woocommerce со стилями значков - . Или, если ваш дочерний стиль заменил стили woocommerce и storefront, удалите все зависимости от woocommerce, затем сделайте значки зависимостью вашего дочернего стиля, а затем удалите woocommerce вместе со стилем storefront. И т. д., и т. д., и т. д., настраивая его до бесконечности в соответствии с вашими конкретными потребностями.

      add_action( 'wp_enqueue_scripts', 'enqueue_styles' );
function enqueue_styles() {
    wp_enqueue_style( 'storefront-woocommerce-style', get_template_directory_uri() . '/assets/css/woocommerce/woocommerce.css', array( 'storefront-icons' ), $storefront_version );
    wp_enqueue_style( 'storefront-child-style', get_stylesheet_directory_uri() . '/style.css', '', $storefront_version );
}

add_action( 'wp_enqueue_scripts', 'dequeue_styles', 99 );
function dequeue_styles() {
    wp_dequeue_style( 'storefront-style' );
}