Этот пост поднимает несколько вопросов, с которыми я столкнулся в связи с недавними изменениями в методах постановки таблиц стилей, поднятыми в этой теме и этой теме .
Проблемы, с которыми я столкнулся, возникли в общем сценарии использования, использующем широко используемую и хорошо поддерживаемую родительскую тему, специально предназначенную для дочерней темы и готовую для установки WP 4.0. В файле functions.php моей дочерней темы содержится только та wp_enqueue_styleфункция, которая подробно описана в Кодексе .
Обратите внимание, что хотя приведенный ниже код относится только к этой теме, во многих из них используются текущие соглашения о кодировании, используемые родительскими темами. Кроме того, мои проблемные области, скорее всего, дублируются на большом количестве установленных родительских тем, которые в настоящее время находятся на свободе. Кроме того, эти вопросы применимы на универсальном уровне, независимо от того, какая родительская тема используется.
ВОПРОС 1: Два очереди
Рекомендуемая настройка:
Родительская тема ставит в очередь стили и сценарии с использованием wp_enqueue_scriptsловушки, а соответствующая часть выглядит следующим образом:
add_action('wp_enqueue_scripts', 'parent_theme_function_name');
function parent_theme_function_name() {
wp_register_style( 'avia-style' , $child_theme_url."/style.css", array(), '2', 'all' );
wp_enqueue_style( 'avia-base');
if($child_theme_url != $template_url) { wp_enqueue_style( 'avia-style'); }
}Моя functions.phpдочерняя тема ставит в очередь стили в соответствии с последними изменениями кодекса:
add_action( 'wp_enqueue_scripts', 'enqueue_parent_theme_style' );
function enqueue_parent_theme_style() {
wp_enqueue_style( 'dm-parent-style', get_template_directory_uri().'/style.css' );
}Обратите внимание на следующие идентификаторы, используемые в указанном коде:
id='dm-parent-style-css'таблица стилей родительской темы, поставленная в очередь моей функцией дочерней темыid='avia-style-css'таблица стилей моей дочерней темы, поставленная в очередь функцией родительской темыid='dm-child-style-css'таблица стилей моей дочерней темы, поставленная в очередь моей функцией дочерней темы
Результаты:
На первый взгляд все было в порядке, а <head> отображал следующий порядок:
<link rel='stylesheet' id='dm-parent-style-css' href='testinstall.dev/wp-content/themes/enfold/style.css?ver=4.0' type='text/css' media='all' />
<!-- Multiple individual parent theme styles here -->
<link rel='stylesheet' id='avia-style-css' href='testinstall.dev/wp-content/themes/child-theme/style.css?ver=2' type='text/css' media='all' />После установки плагина порядок постановки в очередь изменился следующим образом:
<link rel='stylesheet' id='dm-parent-style-css' href='testinstall.dev/wp-content/themes/enfold/style.css?ver=4.0' type='text/css' media='all' />
<!-- Multiple individual parent theme styles here -->
<link rel='stylesheet' id='avia-style-css' href='testinstall.dev/wp-content/themes/child-theme/style.css?ver=2' type='text/css' media='all' />
<!-- Pesky plugin styles -->В конечном счете, мне нужно, чтобы css моей дочерней темы загружался после любых плагинов, поэтому я был вынужден добавить номер приоритета к функции в моей дочерней теме (см. Предыдущее обсуждение относительно номера приоритета) .
Поскольку моя функция ставит в очередь только css родительской темы, в результате получается, что теперь css родительской темы перемещается в конец, оставляя css моей дочерней темы в еще худшем положении, чем раньше.
<!-- Multiple individual parent theme styles here -->
<link rel='stylesheet' id='avia-style-css' href='testinstall.dev/wp-content/themes/child-theme/style.css?ver=2' type='text/css' media='all' />
<!-- Pesky plugin styles -->
<link rel='stylesheet' id='dm-parent-style-css' href='testinstall.dev/wp-content/themes/enfold/style.css?ver=4.0' type='text/css' media='all' />Теперь я вынужден прибегнуть к постановке в очередь моего стиля дочерней темы, чтобы убедиться, что он перемещен обратно в начало строки, что вызывает вышеупомянутую проблему двух очередей (новый термин? Lol) дочерней темы css.
Устаревшая установка:
Пересмотренная функция в детской теме:
add_action( 'wp_enqueue_scripts', 'enqueue_parent_theme_style', 99 );
function enqueue_parent_theme_style() {
wp_enqueue_style( 'dm-parent-style', get_template_directory_uri().'/style.css' );
wp_enqueue_style( 'dm-child-style', get_stylesheet_directory_uri().'/style.css' );
}Результаты:
Производим следующий порядок в <head>:
<!-- Multiple individual parent theme styles here -->
<link rel='stylesheet' id='avia-style-css' href='testinstall.dev/wp-content/themes/child-theme/style.css?ver=2' type='text/css' media='all' />
<!-- Pesky plugin styles -->
<link rel='stylesheet' id='dm-parent-style-css' href='testinstall.dev/wp-content/themes/enfold/style.css?ver=4.0' type='text/css' media='all' />
<link rel='stylesheet' id='dm-child-style-css' href='testinstall.dev/wp-content/themes/child-theme/style.css?ver=2' type='text/css' media='all' />Хотя включение дочерней таблицы стилей в мою функцию приводило к ее двойной постановке в очередь, IMHO это предпочтительнее, чем кодирование, при условии, что родительская тема должным образом поставит в очередь нашу дочернюю таблицу стилей для нас. Исходя из идентификаторов, назначенных для каждого стиля в очереди, создается впечатление, что родительская тема ставит его в очередь, а не что-либо в WP Core.
Мой Шивм:
Хотя я вряд ли рекомендую это как рекомендуемое средство (и я уверен, что разработчики с большим опытом кодирования, чем я, будут стонать в этом решении), я удалил ID родительской темы (используемый для постановки в очередь стиля моей дочерней темы) прямо над моей собственной постановкой в очередь. в файле функций моей дочерней темы, как показано:
add_action( 'wp_enqueue_scripts', 'enqueue_parent_theme_style', 99 );
function enqueue_parent_theme_style() {
wp_enqueue_style( 'dm-parent-style', get_template_directory_uri().'/style.css' );
wp_dequeue_style( 'avia-style' );
wp_enqueue_style( 'dm-child-style', get_stylesheet_directory_uri().'/style.css' );
}Результаты:
Это решило проблемы под рукой, в результате чего:
<!-- Multiple individual parent theme styles here -->
<!-- Plugin styles -->
<link rel='stylesheet' id='dm-parent-style-css' href='testinstall.dev/wp-content/themes/enfold/style.css?ver=4.0' type='text/css' media='all' />
<link rel='stylesheet' id='dm-child-style-css' href='testinstall.dev/wp-content/themes/child-theme/style.css?ver=2' type='text/css' media='all' />Конечно, это требовало знания идентификатора, используемого родительской темой - что-то более общее необходимо было бы использовать в качестве стандартной методологии разработки дочерней темы.
ВОПРОС 2: Перемещенные дочерние таблицы стилей
(Кажется, трудно поверить, что это не появилось в другой ветке, хотя я не видел каких-то конкретных, когда смотрел ... если я пропустил это, не стесняйтесь, чтобы обратить на это мое внимание.)
Я никогда не использую значение по умолчанию style.cssв корневом каталоге дочерней темы для моих стилей темы - оно, очевидно, должно быть там, но все мои настоящие стили скомпилированы из SCSS в виде уменьшенного файла .css в каталоге / css /. Хотя я понимаю, что это не «ожидаемая норма» на универсальном уровне для разработки дочерних тем, большинство серьезных разработчиков WordPress, которых я знаю, делают нечто подобное. Это, конечно, требует вручную ставить эту таблицу стилей в мою функцию независимо от того, поставила ли она в очередь родительскую тему или нет.
Подводя итог всего этого ...
- Безопасно ли включать допущение, что родительские темы должным образом ставят в очередь стили дочерних тем с точки зрения стандартов дочерних тем?
- Удаление приоритета может создать путаницу для части сообщества WordPress, когда стили дочерних тем начинают перезаписываться плагином. Мы ожидаем, что темы будут перезаписывать стили, но не так сильно с плагинами.
- При использовании пользовательской таблицы стилей для фактических стилей дочерней темы (как предполагается, чтобы поместить их в предопределенные
style.css), необходимо вручную ставить этот файл в очередь. С точки зрения поддержания преемственности среди широкого круга разработчиков, не имеет ли смысла поощрять ручную постановку в очередь дочерней таблицы стилей независимо от возможного дублирования?