wp_enqueue_style для плагина с несколькими таблицами стилей

Question

wp_enqueue_style для плагина с несколькими таблицами стилей

3 мар. 2014 г., 20:26:22

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

Голосов: 6

Я разрабатываю плагин навигации, который добавляет анимацию к навигации WordPress.

Я прочитал в документации WordPress, что мне нужно использовать wp_enqueue_style().

Во-первых, как использовать этот код для нескольких CSS файлов в моем основном файле плагина?

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

function add_my_stylesheet() 
{
    wp_enqueue_style( 'myCSS', plugins_url( '/css/myCSS.css', __FILE__ ) );
}

add_action('admin_print_styles', 'add_my_stylesheet');

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

function add_my_stylesheet() 
{
    wp_enqueue_style( 'myCSS', plugins_url( '/css/myCSS.css', __FILE__ ) );
}

add_action('admin_print_styles', 'add_my_stylesheet');

function add_my_stylesheet1() 
{
    wp_enqueue_style( 'myCSS1', plugins_url( '/css/myCSS1.css', __FILE__ ) );
}

add_action('admin_print_styles', 'add_my_stylesheet1');

Или

function add_my_stylesheet1() 
{
    wp_enqueue_style( 'myCSS1', plugins_url( '/css/myCSS.css', __FILE__ ) );
    wp_enqueue_style( 'myCSS1', plugins_url( '/css/myCSS1.css', __FILE__ ) );
}

add_action('admin_print_styles', 'add_my_stylesheet1');

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

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

Например, в формате PHP я бы использовал следующее:

<link href="nav-<?php echo $name; ?>.css">

Переменная $name должна быть той, которая выбрана на странице настроек, но как мне вызвать необходимую таблицу стилей?

Надеюсь, мой вопрос достаточно понятен.

Uzair Hayat

163

wp enqueue style

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

Используйте условный оператор if для проверки соответствия вашим критериям, например:

определённая страница/запись (ID)
все страницы/записи
связанные с настройкой администратора.

Таким образом, CSS будет загружаться только на нужных страницах или при выбранной определённой настройке администратора.

    function add_my_stylesheet1() 
    {
        if(is_page(41)){
            wp_enqueue_style( 'myCSS1', plugins_url( '/css/myCSS.css', __FILE__ ) );
        }else{
            wp_enqueue_style( 'myCSS1', plugins_url( '/css/myCSS1.css', __FILE__ ) );
        }
    }

Или:

    function add_my_stylesheet1() 
    {
        $adminopt = get_option( $option, $default );
        if($adminopt == "Normal CSS"){
            wp_enqueue_style( 'myCSS', plugins_url( '/css/myCSS.css', __FILE__ ) );
        }else{
            wp_enqueue_style( 'myCSS1', plugins_url( '/css/myCSS1.css', __FILE__ ) );
        }
    }

ScottMcGready

101

3 мар. 2014 г. 20:54:01

add_action( 'admin_enqueue_scripts', 'safely_add_stylesheet_to_admin' );

/** * Добавляет таблицу стилей на страницу */
function safely_add_stylesheet_to_admin() {
    wp_enqueue_style( 'prefix-style', plugins_url('plugin_styles.css', __FILE__) );
    wp_enqueue_style( 'prefix-basic', plugins_url('/css/basic.css', __FILE__) );
}

vishakha

1

22 янв. 2017 г. 20:43:28

Комментарии

Пожалуйста, всегда объясняйте, что делает код. Просто отправьте [правку] и объясните, почему ваш код решает проблему автора вопроса.

kaiser

22 янв. 2017 г. 21:14:52

bosco 6.98K · Accepted Answer · 2014-03-03T22:39:10Z

Отвечая на ваш первый вопрос, следует использовать второй стиль, а именно:

function add_my_stylesheet() 
{
    wp_enqueue_style( 'myCSS', plugins_url( '/css/myCSS.css', __FILE__ ) );
    wp_enqueue_style( 'myCSS1', plugins_url( '/css/myCSS1.css', __FILE__ ) );
}

add_action('admin_print_styles', 'add_my_stylesheet');

Функция add_action() говорит WordPress: «Когда происходит действие admin_print_styles, выполни функцию add_my_stylesheet()». Как ни странно, использование действий admin_print_styles и admin_enqueue_styles для подключения таблиц стилей является неправильным — как бы противоречиво это ни звучало, вместо них следует использовать admin_enqueue_scripts.

Вызовы wp_enqueue_style() добавляют указанные таблицы стилей в список тех, которые будут загружены (если вы укажете аргумент зависимостей, WordPress также позаботится о том, чтобы ваши таблицы стилей загружались в правильном порядке). Вам не нужно «вызывать» подключённую таблицу стилей, как вы предположили — если она добавлена в очередь, она будет выведена в HTML-элементе <link ...> в секции <head></head> так же, как WordPress загружает свои собственные таблицы стилей.

Чтобы выбрать, какая таблица стилей будет загружена, просто добавьте вашу логику в функцию add_my_stylesheet(); если вы не хотите использовать какую-то таблицу стилей, просто не добавляйте её в очередь, например:

function admincolorplugin_enqueue_styles() 
{
    // Получаем выбор пользователя из настроек, по умолчанию "white"
    $stylesheet = get_option( 'admincolorplugin_stylesheet', 'white' );

    // Условно загружаем соответствующую таблицу стилей
    if( $stylesheet == 'black' ) {
        wp_enqueue_style( 'admincolorplugin-black', plugins_url( '/css/black.css', __FILE__ ) );
    }
    else {
        wp_enqueue_style( 'admincolorplugin-white', plugins_url( '/css/white.css', __FILE__ ) );
    }
}

add_action('admin_enqueue_scripts', 'admincolorplugin_enqueue_styles' );