wp_enqueue_style() │ WP 2.6.0

Adds a CSS stylesheet file to the page. Also registers the stylesheet file if it wasn't registered.

If the stylesheet file was previously registered with wp_register_style() then you can enqueue it just by using the style identifier - first $handle parameter.

If the stylesheet isn't registered then this function will register and enqueue it.

The enqueued stylesheet will be printed within the <head> tag.

Since version 3.3 can be called in the middle of the document — in this case the stylesheet file will be printed in the footer, before the closing </body> tag (where wp_footer() is called).

This function like wp_enqueue_script() need to be hooked on one of following actions:

Use wp_style_add_data() to add conditions for stylesheets loading.

To add custom CSS styles to the page use wp_add_inline_style()

If your theme doesn't have wp_head() or wp_footer() then this function may not work at all. It's because the styles are loaded on actions (hooks) created by these functions.

Uses: WP_Dependencies::add(), WP_Dependencies::enqueue()
Used By: wp_enqueue_code_editor()

No Hooks.

Return

null. Nothing (null).

Usage

wp_enqueue_style( $handle, $src, $deps, $ver, $media );
$handle(string) (required)
Name of the stylesheet (identifier). A lowercase string. If the string contains a question mark (?): styleaculous?v=1.2, then the preceding part will be the name of the style, and all that text after the question mark will be added to the URL as request parameters. So you can, for example, specify the version of the style.
$src(string)
URL of the stylesheet. For example, http://example.com/css/style.css. There's no need to specify a hardcoded path, use the following functions: plugins_url() (for plugins) and get_template_directory_uri() (for themes). External domains can be specified with implicit protocol //example.com/css/style.css
Default: ''
$deps(array)
An array of identifiers of registered stylesheets this stylesheet depends on. These stylesheets will be loaded before the current one.
Default: empty array
$ver(string/true/false/null)
String specifying stylesheet version number. The version will be added to the end of the stylesheet's URL: ?ver=3.5.1. If version is set to false, a version number is automatically added equal to current installed WordPress version. If set to null, no version is added.
Default: false
$media(string)
The media for which this stylesheet has been defined. Accepts media types like 'all', 'print' and 'screen', or media queries like '(orientation: portrait)' and '(max-width: 640px)'.
Default: 'all'

Examples

2

#1 Loading styles for plugin submenu page 

add_action( 'admin_menu', 'my_plugin_admin_menu' );

function my_plugin_admin_menu() {
	// Register plugin page
	$page = add_submenu_page(
		'edit.php',
		 __( 'My Plugin', 'myPlugin' ), 
		 __( 'My Plugin', 'myPlugin' ),
		 'administrator',
		 __FILE__, 
		'my_plugin_manage_menu'
	);

	// Connect to a needed hook using the plugin page identifier 
	add_action('load-'. $page, 'my_plugin_admin_styles');
}

// This function will be called only on the page of the plugin
function my_plugin_admin_styles() {
	wp_enqueue_style( 'myPluginStylesheet', plugins_url('stylesheet.css', __FILE__) );
}

// The page
function my_plugin_manage_menu() {
   // page code
}
0

#2 Basic Usage

In this example, we will register and enqueue styles and scripts using the 'wp_enqueue_scripts'action.

// The right way for adding styles and scripts to the page
add_action( 'wp_enqueue_scripts', 'theme_name_scripts' );
// add_action('wp_print_styles', 'theme_name_scripts'); // use can use this hook too
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 );
}

Paste this code into the theme file function.php or into the plugin, before the function wp_head() is called in header.php

Notes

The function uses global variable $wp_styles that is an instance of WP_Styles class. Uses methods WP_Styles::add(), WP_Styles::enqueue().

Notes

Changelog

Since 2.6.0 Introduced.

wp_enqueue_style() code WP 6.6.2

wp-includes/functions.wp-styles.php 
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 );
}

styles (include files)

Scripts and Styles

Main Functions