Enqueue and Register Internet Explorer CSS Style Sheets in WordPress

To  enqueue and register IE stylesheets in WordPress as appose to manually hardcoding them into a header.php file you need to add a function with the style sheet registered and enqueued and then add an action to load the stylesheet, the function also needs to contain the conditions of which IE version is targeted.

Add in a function and action

Open up functions.php and add in a function and action like so:

function ie_style_sheets () {
//code goes here
}

add_action ('wp_enqueue_scripts','ie_style_sheets');

The function in this example is named ie_style_sheets(), you can name it what you like, the action wp_enqueue_scripts is going to load the function ie_style_sheets with all styles and scripts inside it.

 

Register and Enqueue the style sheet

function ie_style_sheets () {
wp_register_style( 'ie8', get_stylesheet_directory_uri() . '/ie8.css'  );

wp_enqueue_style( 'ie8' );
}

add_action ('wp_enqueue_scripts','ie_style_sheets');

The above for instance will target just IE8, register the style sheet and enqueue it.

 

Add in the IE Conditions

function ie_style_sheets () {
wp_register_style( 'ie8', get_stylesheet_directory_uri() . '/ie8.css'  );
$GLOBALS['wp_styles']->add_data( 'ie8', 'conditional', 'lte IE 8' );

wp_enqueue_style( 'ie8' );
}

add_action ('wp_enqueue_scripts','ie_style_sheets');

The above for instance will target just IE8 and lower .

 

Add in Multiple Variations if Required

function ie_style_sheets () {
wp_register_style( 'ie8', get_stylesheet_directory_uri() . '/ie8.css'  );
$GLOBALS['wp_styles']->add_data( 'ie8', 'conditional', 'lte IE 9' );

wp_register_style( 'ie6', get_stylesheet_directory_uri() . '/ie6.css'  );
$GLOBALS['wp_styles']->add_data( 'ie6', 'conditional', 'lt IE 7' );

wp_enqueue_style( 'ie8' );
wp_enqueue_style( 'ie6' );
}

add_action ('wp_enqueue_scripts','ie_style_sheets');

One of the key benefits of setting it up like this is that you can bundle in all your styles and scripts into one function.