it-swarm.com.ru

как поставить в очередь мою дочернюю таблицу стилей/s * после * каждой родительской таблицы стилей/оператора?

Я использую хорошо написанную тему "Энология" Чипа Беннетта как Родителя для моей собственной темы "Ребенок".

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

Я только что обнаружил, что мой основной файл style.css загружается перед каждой другой ссылкой или заявлением таблицы стилей в <head>, и это объясняет, почему у меня возникли проблемы с переопределением некоторых родительских стилей.

дальнейшее изучение проблемы показывает, что различные родительские таблицы стилей и стили могут быть поставлены в очередь в <head> в трех местах; add_action('wp_print_styles',, add_action('wp_enqueue_scripts',, а затем add_action('wp_head',.

для простоты я планирую создать две таблицы стилей. первый основной лист 'style.css' будет содержать только команду @import url(), необходимую для загрузки основной таблицы стилей Oenology.

вторая таблица стилей будет содержать мои дочерние правила. чтобы убедиться, что он загружен после всех других правил, я бы поставил его в очередь, используя add_action( 'wp_head',.

это звучит разумно? или есть лучший (более правильный) способ сделать это?

кстати, кто-нибудь знает, что '/parent-theme/style.css? MRPreviewRefresh = 723' средства?

Обновление

wp_enqueue_style () не работает в wp_head ().

веселит,
Грегори

10
Gregory

Просто к вашему сведению, этот вопрос, вероятно, граничит с слишком локализованным , поскольку он специфичен для темы энологии.

Тем не менее, вот где я думаю у вас возникла проблема: энология ставит в очередь две таблицы стилей:

  1. style.css, непосредственно в заголовке документа (таким образом beforewp_head() запущен)
  2. {varietal}.css, в wp_enqueue_scripts, с приоритетом 11, в functions/dynamic-css.php:

    /**
     * Enqueue Varietal Stylesheet
     */
    function oenology_enqueue_varietal_style() {
    
    // define varietal stylesheet
    global $oenology_options;
    $oenology_options = oenology_get_options();
    $varietal_handle = 'oenology_' . $oenology_options['varietal'] . '_stylesheet';
    $varietal_stylesheet = get_template_directory_uri() . '/varietals/' . $oenology_options['varietal'] . '.css';
    
    wp_enqueue_style( $varietal_handle, $varietal_stylesheet );
    }
    // Enqueue Varietal Stylesheet at wp_print_styles
    add_action('wp_enqueue_scripts', 'oenology_enqueue_varietal_style', 11 );
    

Сортовая таблица стилей, которая применяет "скин", ставит в очередь с приоритетом 11, чтобы гарантировать, что базовая таблица стилей, style.css, загружает first и сортовая таблица стилей загружает second, чтобы вызвать правильный каскад ,.

Итак, если вам нужно переопределить таблицу стилей varietal, просто поставьте в очередь свою вторую таблицу стилей после таблицы стилей varietal; т.е. с приоритетом не менее 12 или выше.

Правка

Чтобы дать более общий ответ, на более общий вопрос:

Чтобы переопределить очередь таблиц стилей родительской темы, вам необходимо знать две вещи:

  1. Action hook, в который ставится таблица стилей
  2. Priority, при котором обратный вызов добавляется в ловушку

Функции постановки в очередь (wp_enqueue_script()wp_enqueue_style()) могут быть _/правильно выполнены в любом месте между хуком init и хуками wp_print_scriptswp_print_styles. (Хук _/семантически правильный, для которого выполняются функции wp_enqueue_*(), в настоящее время wp_enqueue_scripts.) Этот список включает следующие действия (среди прочих; это просто обычные подозреваемые):

  • init
  • wp_head
  • wp_enqueue_scripts
  • wp_print_scriptswp_print_styles

(Обратите внимание, что wp_enqueue_scripts, wp_print_styles и wp_print_scriptsвсе запускаются _/внутриwp_head, с определенным приоритетом .

Итак, чтобы переопределить таблицу стилей Parent-Theme, вам необходимо выполнить одно из следующих действий:

  • Удаление из очереди Таблица стилей родительской темы, через wp_dequeue_style( $handle )
  • Удалить обратный вызов родительской темы , который ставит в очередь стиль, через remove_action( $hook, $callback )
  • Используйте каскад CSS для overrideтаблицы стилей Parent-Theme, перехватив вызов wp_enqueue_style() таблицы стилей Child-Theme в тот же хук с более низким приоритетом или в хук Later.

    Для этого последнего варианта, если родительская тема использует:

    `add_action( 'wp_enqueue_scripts', 'parent_theme_enqueue_style', $priority )`
    

    ... тогда тема ребенка будет использовать:

    `add_action( 'wp_enqueue_scripts', 'child_theme_enqueue_style', {$priority + 1} )`
    
18
Chip Bennett

единственный способ гарантировать, что у моих стилей было последнее слово в каскаде, было включить их в конец <head> через хук wp_head. wp_enqueue не работает внутри wp_head, поэтому я должен был отобразить ссылку напрямую:

function gregory_enqueue_stylesheets() {
    $base = get_stylesheet_directory_uri();
    echo '<link rel="stylesheet" href="'.$base.'/style-gregory.css" type="text/css" media="all">';
    return;
}
add_action( 'wp_head', 'gregory_enqueue_stylesheets', 18 );

наконец, я могу устанавливать свои стили относительно легко, без использования высокого уровня специфичности или правила! Important, которое следует использовать только в качестве крайней меры.

WP нужна лучшая система оформления стилей. каждый стиль, будь то ссылка на файл или встроенный стиль, должен передаваться через один и тот же хук, позволяющий Приоритету определять их порядок. необязательно для целей отладки, было бы полезно, если бы ловушка также выводила значения Приоритета каждого стиля, возможно, в закомментированной форме.

Обновление

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

таблица стилей моей дочерней темы по умолчанию:

/*
Theme Name: Oenology-Gregory
Template: oenology
Version: 20120506-0026
*/

@import url("/wp-content/themes/oenology/style.css");

функция, чтобы поставить мою основную таблицу стилей в очередь:

function gregory_enqueue_stylesheets() {
    $base = get_stylesheet_directory_uri();
    wp_enqueue_style( 'style-gregory', $base.'/style-gregory.css' );
    return;
}
add_action( 'wp_enqueue_scripts', 'gregory_enqueue_stylesheets', 18 );

однако есть несколько сгенерированных WP операторов стилей (то есть, не родительская тема), которые устанавливаются после моей таблицы стилей, и мне придется взглянуть на использование либо высокоспецифичных правил CSS, чтобы переопределить правила, которые меня касаются или ищите хуки для их отключения, в частности правило body.custom-background.

спасибо всем за ваши комментарии.

веселит,
Грегори

2
Gregory

Вы должны всегда использовать wp_enqueue_style() чтобы загрузить таблицу стилей и функции должны быть подключены к wp_enqueue_scripts hook с запускается в голове . Я подозреваю, что вы не зацепили это там, отсюда ваша проблема. (Начиная с WP 3.3, если wp_enqueue_style() подключен к чему-либо еще, он выдает уведомление с включенным WP_Debug).

1
mrwweb