Life runs on code

Loading IE Conditional Stylesheets in WordPress

Loading IE Conditional Stylesheets in WordPress

Most web developers are familiar with the IE conditional comments that allow you to load a stylesheet only in Internet Explorer.

<!-- [if lt IE 9]>
   <link href="ie.css" rel="stylesheet" type="text/css">
<![endif]-->

Many new WordPress developers tend to just hardcode these conditional comments directly into their theme’s header.php file. The correct way to load stylesheets in WordPress is using the wp_enqueue_style() function.

add_action( 'wp_enqueue_scripts', 'enqueue_my_styles' );

function enqueue_my_styles() {
   global $wp_styles;
   enqeue_style( 'my-theme-ie', get_stylesheet_directory_uri() . 'ie.css' );
   //add_data function to add IE Condition
   $wp_styles->add_data( 'my-theme-ie', 'conditional', 'IE 9' );
}

 



Leave a Reply

Your email address will not be published. Required fields are marked *