Business
Actus
Événements
Savoir Faire
Tutos
Thèmes
Plugins
E-commerce
SEO
Tutos Ajouter un fichier CSS conditionnel pour Internet Explorer
Internet Explorer est le vilain petit canard des navigateurs Internet. Découvrez une astuce pour ajouter des fichiers CSS conditionnels sur WordPress.
Internet Explorer est le cauchemar de tous les intégrateurs HTML/CSS. Pour spécifier un fichier CSS uniquement à IE, on utilise des conditions.
WordPress permet d’ajouter des conditions IE pour les fichiers CSS que l’on intègre à l’aide des fonctions wp_register_styles() et wp_enqueue_styles().
Pour ajouter une condition IE a un fichier CSS, la procédure de déclaration du fichier reste inchangée. La différence se fait à l’aide de la méthode add_data de la class WP_Styles. C’est grâce au troisième argument de cette méthode que nous allons modifier la condition de notre fichier CSS.
Comme d’habitude, ce code est à placer dans le fichier functions.php de votre thème.
[pastacode lang=”php” message=”” highlight=”” provider=”manual”]
add_action('wp_print_styles', 'gkp_ie_css');
function gkp_ie_css() {
wp_register_style('style-ie', get_stylesheet_directory_uri() . '/style-ie.css');
wp_enqueue_style('style-ie');
global $wp_styles;
$wp_styles->add_data( 'style-ie', 'conditional', 'lte IE 7' ); // On met la condition ici !!
}
[/pastacode]
L’astuce suivante retourne le résultat suivant :
[pastacode lang=”php” message=”” highlight=”” provider=”manual”]
<!--[if lte IE 7]>
<link rel='stylesheet' id='style-ie-css' href='https://www.geekpress.fr/wp-content/themes/geekpress/design/style-ie.css?ver=3.2' type='text/css' media='all' />
<![endif]-->
[/pastacode]
Article écrit par Jonathan B.
Youtube
Twitter
Facebook
1 Commentaire
Je conseillerais plutôt de changer l’en-tête pour en mettre un du style :
Cela permet dans le CSS si l’on veut cibler ie7 par exemple d’utilisateur :
.ie7 .class { color:red; }