WordPress как на ладони
Очень Удобный и Быстрый Хостинг для сайтов на WordPress. Пользуюсь сам и вам рекомендую!

wp_enqueue_style()WP 2.6.0

Правильно добавляет файл CSS стилей. Регистрирует файл стилей, если он еще не был зарегистрирован.

Если файл стилей был предварительно зарегистрирован через wp_register_style(), то его можно добавить в очередь, указав название (идентификатор) в первом параметре $handle.

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

Добавленный в очередь файл стилей выводится в <head> части документа.

С версии 3.3 можно вызывать в середине документа. В этом случае файл будет выведен в подвале, перед тегом </body> (где вызывается wp_footer()).

Эту функцию как и wp_enqueue_script() принято вызывать во время событий:

  • Используйте wp_style_add_data(), чтобы добавить условия подключения стилей.
  • Используйте wp_add_inline_style(), чтобы вставить в документ сами CSS стили, а не файл стилей.

Ошибка начинающих разработчиков. Функция ничего не выведет, если в теме не используется wp_head() или wp_footer(). Именно в момент вызова этих функций срабатывает хук, который добавляет стили.

Работает на основе: WP_Dependencies::add(), WP_Dependencies::enqueue()
Основа для: wp_enqueue_code_editor()

Хуков нет.

Возвращает

null. Ничего не возвращает.

Использование

wp_enqueue_style( $handle, $src, $deps, $ver, $media );
$handle(строка) (обязательный)
Название файла стилей (идентификатор). Строка в нижнем регистре. Если строка содержит знак вопроса (?): styleaculous?v=1.2, то предшествующая часть будет названием стиля, а все что после будет добавлено в УРЛ как параметры запроса. Так можно указывать версию подключаемого стиля.
$src(строка)
УРЛ к файлу стилей. Например, http://example.com/css/style.css. Не нужно указывать путь жестко, используйте функции: plugins_url() (для плагинов) и get_template_directory_uri() (для тем). Внешние домены можно указывать с неявным протоколом //example.com/css/style.css.
По умолчанию: ''
$deps(массив)
Массив идентификаторов других стилей, от которых зависит подключаемый файл стилей. Указанные тут стили, будут подключены до текущего.
По умолчанию: array()
$ver(строка/логический)
Строка определяющая версию стилей. Версия будет добавлена в конец ссылки на файл: ?ver=3.5.1. Если не указать (установлено false), будет использована версия WordPress. Если установить null, то никакая версия не будет установлена.
По умолчанию: false
$media(строка/логический)
Устанавливается значение атрибута media. media указывает тип устройства для которого будет работать текущий стиль. Может быть: all, screen, handheld, print или all (max-width:480px). Полный список смотрите здесь.
По умолчанию: 'all'

Примеры

35

#1 Подключение через событие

В этом примере, мы зарегистрируем и подключим стили и скрипты, используя событие 'wp_enqueue_scripts'.

// правильный способ подключить стили и скрипты
add_action( 'wp_enqueue_scripts', 'theme_name_scripts' );
// add_action('wp_print_styles', 'theme_name_scripts'); // можно использовать этот хук он более поздний
function theme_name_scripts() {
	wp_enqueue_style( 'style-name', get_stylesheet_uri() );
	wp_enqueue_script( 'script-name', get_template_directory_uri() . '/js/example.js', array(), '1.0.0', true );
}

Вставляем этот код в файл темы functions.php или в плагин. В любое место, но до функции wp_head() которая вызывается в header.php

16

#2 Загрузка стилей на странице настроек плагина

add_action( 'admin_menu', 'my_plugin_admin_menu' );

function my_plugin_admin_menu() {
	// регистрируем страницу плагина
	$page = add_submenu_page(
		'edit.php',
		 __( 'My Plugin', 'myPlugin' ),
		 __( 'My Plugin', 'myPlugin' ),
		 'administrator',
		 __FILE__,
		'my_plugin_manage_menu'
	);

	// используя идентификатор страницы плагина подключаемся к нужному событию
	add_action( 'load-'. $page, 'my_plugin_admin_styles' );
}

// Эта функция будет вызвана только на странице настроек плагина,
function my_plugin_admin_styles() {
	wp_enqueue_style( 'myPluginStylesheet', plugins_url( 'stylesheet.css', __FILE__ ) );
}

// Страница настроек
function my_plugin_manage_menu() {
   // код страницы настроек
}

Заметки

Использует глобальную переменную $wp_styles, которая содержит экземпляр класса WP_Styles. Использует методы WP_Styles::add(), WP_Styles::enqueue().

Заметки

Список изменений

С версии 2.6.0 Введена.

Код wp_enqueue_style() WP 6.4.3

function wp_enqueue_style( $handle, $src = '', $deps = array(), $ver = false, $media = 'all' ) {
	_wp_scripts_maybe_doing_it_wrong( __FUNCTION__, $handle );

	$wp_styles = wp_styles();

	if ( $src ) {
		$_handle = explode( '?', $handle );
		$wp_styles->add( $_handle[0], $src, $deps, $ver, $media );
	}

	$wp_styles->enqueue( $handle );
}
26 комментариев
Полезные 3 Все
    Войти