Использование wp_add_inline_style без таблицы стилей

Question

Использование wp_add_inline_style без таблицы стилей

19 нояб. 2014 г., 12:26:24

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

Голосов: 32

Мне нужно добавить пользовательские встроенные стили в header пользовательской темы, которую я создаю. Я наткнулся на функцию wp_add_inline_style(), которая работает, но не совсем подходит мне, так как зависит от определенной таблицы стилей. Мне нужно добавить встроенные стили в конец тега head без зависимости от таблицы стилей.

Я пробовал установить либо таблицу стилей темы, либо несуществующую. В обоих случаях это работает, но, на мой взгляд, это немного грязный хак (либо загружать таблицу стилей темы дважды, либо ссылаться на несуществующий файл...). Существует ли правильный способ добавления встроенных стилей в head без зависимости от таблицы стилей?

Конечно, я мог бы добавить их непосредственно в файл header.php, но хотелось бы этого избежать.

terzag

323

разработка тем wp enqueue style

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

Вы можете просто использовать "фиктивный" обработчик:

wp_register_style( 'dummy-handle', false );
wp_enqueue_style( 'dummy-handle' );

wp_add_inline_style( 'dummy-handle', '* { color: red; }' );

Flix

511

14 окт. 2017 г. 03:42:33

Комментарии

Мне очень нравится это решение, потому что мой стиль имеет handle и добавляется в очередь, как если бы он был подключен из .css файла.

dev_masta

7 нояб. 2018 г. 13:33:10

Использование false в качестве источника для wp_register_style также не разрешено согласно документации https://codex.wordpress.org/Function_Reference/wp_register_style#Parameters

16patsle

13 февр. 2019 г. 14:56:59

@16patsle - Не уверен, что вы правы. Если вы используете false, это означает, что стиль является алиасом для других зависимых стилей. Вот и всё.

kanlukasz

25 окт. 2020 г. 17:21:59

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

16patsle

26 окт. 2020 г. 18:51:10

На сегодняшний день (сентябрь 2022) документация была перемещена на https://developer.wordpress.org/reference/functions/wp_register_style/ и теперь явно одобряет этот метод установки источника в 'false' со следующим объяснением: "Если источник установлен в false, таблица стилей становится алиасом для других таблиц стилей, от которых она зависит."

ChrisM

15 сент. 2022 г. 04:37:52

Комментарии

Без проблем! Рад был помочь.

SkyShab

19 нояб. 2014 г. 22:28:53

Если вы (как и я) хотите добавить пользовательский встроенный CSS на страницы админ-панели, вы можете использовать действие admin_head.

That Brazilian Guy

29 янв. 2018 г. 16:05:44

@SkyShab почему после style> стоит звездочка?

Michael Rogers

10 авг. 2020 г. 21:13:04

@MichaelRogers это просто пример CSS стилей. Символ "*" — это "универсальный селектор". Он сделает все элементы красными.

SkyShab

21 авг. 2020 г. 19:34:46

о, хаха, спасибо

Michael Rogers

22 авг. 2020 г. 04:54:56

Ваша тема, несомненно, имеет таблицу стилей по умолчанию (иначе она даже не загрузилась бы как тема). Просто используйте эту самую таблицу стилей в качестве обработчика для вашего встроенного CSS. Пример можно найти в файле functions.php темы TwentyFifteen (код сокращен для краткости):

function twentyfifteen_scripts() {
    wp_enqueue_style( 'twentyfifteen-style', get_stylesheet_uri() );

}
function twentyfifteen_post_nav_background() {
    wp_add_inline_style( 'twentyfifteen-style', $css );
}

Casper

58

17 авг. 2017 г. 07:40:41

Комментарии

OP явно запросил метод, отличный от использования wp_add_inline_style(). Оба метода работают, и я не нашел убедительной причины использовать wp_add_inline_style(). Если вам известна такая причина, я хотел бы узнать о ней.

SkyShab

30 янв. 2018 г. 17:24:31

Ваше решение работает, но оно все равно остается "костыльным", согласно тому, что я однажды услышал от кого-то из команды WP (если я не ошибаюсь); это не совсем мое мнение. Я думаю, что OP предполагал, что нет способа сделать это без двойной загрузки таблицы стилей или использования "фантомного" хука. В любом случае, если они не разрабатывают плагин, у них всегда есть таблица стилей темы. Я также редактирую свой ответ, так как ваше решение задокументировано в Codex. :)

Casper

30 янв. 2018 г. 21:37:39

Я поэкспериментировал с wp_add_inline_style() и вот что обнаружил. Преимущество привязки стилей к таблице стилей в том, что если она будет удалена из очереди, стили не будут выводиться. Но оба метода выводят их inline в head. Допустим, вы разработчик плагина, и ваши стили выводятся в head. Это не имеет отношения к стилям темы, и если дочерняя тема удалит основные стили темы, чтобы использовать свои, теперь стили вашего плагина не будут выводиться. Возможно, OP указал это как часть запроса именно по этой причине.

SkyShab

31 янв. 2018 г. 22:47:28

SkyShab 1.43K · Accepted Answer · 2014-11-19T16:39:40Z

Вам просто нужно добавить стили непосредственно в заголовок страницы. Лучший способ сделать это — использовать хук 'wp_head', при условии что ваша тема поддерживает этот хук. Вот как это можно сделать:

add_action('wp_head', 'my_custom_styles', 100);

function my_custom_styles()
{
 echo "<style>*{color: red}</style>";
}

Ознакомьтесь с кодексом WordPress чтобы узнать больше о хуках действий.

SkyShab

1.43K

19 нояб. 2014 г. 16:39:40