Почему не применяются стили родительской темы в дочерней в Wordpress?

Question

[Ирина Кириллова]

Всем привет. Создала дочернюю тему на Wordpress, в functions.php дочерней темы подключила стили:
<?php
add_action ('wp_enqueue_scripts', 'theme_enqueue_styles');
function theme_enqueue_styles () {
wp_enqueue_style ('parent-style', get_template_directory_uri() . '/style.css');
wp_enqueue_style ('child-style', get_template_directory_uri() . '/style.css', array ('parent-style')); }
?>
Но теперь на сайте все стили пропали. По идее, дочерние стили должны дополнять родительские, но они почему-то их заменяют полностью. Что я делаю не так?

Answer 1

[Edward]

Вы не правильно подключаете стили.
Используйте этот код, все будет работать 100%:

<?php

add_action( 'wp_enqueue_scripts', 'my_enqueue_styles' );

function my_enqueue_styles() {

    /* If using a child theme, auto-load the parent theme style. */
    if ( is_child_theme() ) {
        wp_enqueue_style( 'parent-style', trailingslashit( get_template_directory_uri() ) . 'style.css' );
    }

    /* Always load active theme's style.css. */
    wp_enqueue_style( 'style', get_stylesheet_uri() );
}

Ну, или проще:

<?php

add_action( 'wp_enqueue_scripts', 'my_enqueue_styles' );

function my_enqueue_styles() {
    wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );
    wp_enqueue_style( 'style', get_stylesheet_uri() );
}

Comments

[Ирина Кириллова]

К сожалению, этот код тоже не работает. Я уже миллион вариантов пробовала-не срабатывает. Может, это тема такая странная? Может, в каком файле запрет какой стоит? Я просто не особо сильна в этом. Но факт остается фактом: через "@import" всё подключается, через functions.php не хочет :(((

[Ирина Кириллова]

Хотя вот такой нюанс: если смотреть код страницы-там всё подключено:

[Edward]

Ирина Кириллова: Ссылку скиньте на тему...

[Ирина Кириллова]

link rel='stylesheet' id='parent-style-css' href='centr-cosmetics.com.ua/wp-content/themes/llorix-on...' type='text/css' media='all'

link rel='stylesheet' id='style-css' href='centr-cosmetics.com.ua/wp-content/themes/llorix-ch...' type='text/css' media='all'

[Edward]

Через "@import" ужа давно стили не подключают, это влияет на скорость загрузки сайта

[Ирина Кириллова]

https://ru.wordpress.org/themes/llorix-one-lite/

[Edward]

Ирина Кириллова: Только что поставил вашу тему, создал дочернюю, подключил кодом, который вам писал - все работает как часы

[Edward]

Ирина Кириллова: Скачайте дочернюю тему и установитеllorix-child

[Ирина Кириллова]

Всё, я поняла, всё у меня работало. Просто стили отличаются, когда только скачала тему и когда установила дочернюю (например, цвета и шрифты главного меню). Наверное, еще какие-то стили нужно подключить?

[Edward]

Ирина Кириллова: Вы должны подключить стили родительской темы и следом стили дочерней темы. Изначально, ваша дочерняя тема будет копией родительской. Потом в файл стилей дочерней темы вносите необходимые правки и вид темы будет меняться.

[Ирина Кириллова]

Спасибо большое, я это понимаю. Не понятно одно: раз дочерние стили являются изначально копией родительских, то почему они так отличаются? Первое, что бросилось в глаза-это другие шрифты и цвет текста и ссылок, background меню. Этот момент не дает мне покоя уже второй день )))

[Edward]

Ирина Кириллова: А вы с чем сравниваете?

[Ирина Кириллова]

Edward: ниже этого коммента пишу ответ, чтоб прикрепить изображения. Первое фото-как только скачала и установила тему, второе-подключила дочернюю.

Answer 2

[Денис Янчевский]

Привет.

Для дочерних стилей нужно использовать функцию get_stylesheet_directory_uri().
Функция get_template_directory_uri() в данном случае вернет путь к родительской теме.

Comments

[Ирина Кириллова]

Поменяла на stylesheet, всё совсем по одному месту пошло :) В общем, мне нужно, чтобы все стили родительской остались, а в дочерней изменить пару-тройку свойств. Как их так подключить?

[Денис Янчевский]

Ирина Кириллова: Попробуйте, например, это руководство https://wpmag.ru/2013/dochernie-temy-wordpress/ .
Также, css-стили можно добавить на сайт с помощью плагина https://ru.wordpress.org/plugins/simple-custom-css/ или его аналогов.

[Ирина Кириллова]

По поводу Dmitrijs Balcers: читала, что не желательно его использовать, а нужно подключать через function.php. А если подключать через Dmitrijs Balcers, тогда не нужен код в functions.php?

[Ирина Кириллова]

Вместо неожиданных фамилий я писала "@import". Не пойму, почему оно вылезло ))))))))

[Денис Янчевский]

Ирина Кириллова: Считается, что данный способ несколько медленнее. Сомневаюсь, что разницу можно заметить невооруженным взглядом)

Насколько я помню, style.css дочерней темы должен подключиться сам, да.

[Денис Янчевский]

Ирина Кириллова: Собственно, можно нагуглить руководство и с wp_enqueue_style https://konstantin.blog/2014/child-themes-import/

[Ирина Кириллова]

ну ок, спасибо за помощь )))

Answer 3

[Ирина Кириллова]

Comments

[Edward]

У вас стили Bootstrap перебивают стили родительской темы, так как подключаются ниже них в коде. Должно быть наоборот, сначала подключаются стили библиотек, потом уже стили родительской темы и в самом низу стили дочерней темы.

[Ирина Кириллова]

Я так понимаю, нужно в коде копаться, чтоб это подключение изменить? В functions.php? (((((

[Edward]

Ирина Кириллова: Замените весь код подключения родительских стилей на этот:

<?php

add_action( 'wp_enqueue_scripts', 'my_enqueue_styles' );

function my_enqueue_styles() {
    wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css', array( 'llorix-one-lite-bootstrap-style' ) );
}

[Ирина Кириллова]

Всё получилось! Огромное Вам спасибо! Вы мне столько времени уделили, еще раз спасибо огромное!!!! )))

[Edward]

Ирина Кириллова: Пожалуйста. Удачи!