You may be aware that you can add conditional statements around your WordPress enqueued CSS styles (such as
<!--[if gt IE 7]><link .../><![endif]-->) to load the script for certain versions of Internet Explorer.
As handy as this is, it doesn’t cater for all situations. This tutorial will show you how you can expand WordPress to add any type of conditional around your enqueued CSS styles.
WordPress gives us the handy
wp_style_add_data() function to add default IE conditionals around our styles, however these do not allow the type of conditional ‘hack’ we need to let our stylesheet render for IE8+ and all modern browsers:
As you can see, the code above will load the stylesheet for older versions of IE only, but it will still be commented out for modern browsers.
style_loader_tag hook! Using this hook we can wrap custom conditional statements around any of our enqueued CSS stylesheets. So to put in the IE8+ and modern browsers, we would simply add the following code:
<noscript> custom conditional statement:
There we go, easy custom conditional statements around WordPress enqueued CSS stylesheets!
Latest posts by Matt Watson (see all)
- Reblog: Responsive Web Design (RWD) Background Images - July 28, 2017
- WordCamp Edinburgh July 2017 - July 26, 2017
- Changing your WordPress site language (locale) dynamically - June 16, 2017