Are you looking for a way to detect the user’s browser to use browser targeted styles? This snippet provides a unique way of detecting the browser so that you can apply special styling for certain browsers.
Instructions:
- Add this code to your theme’s functions.php file or in a site-specific plugin.
- A class with the name of the browser will be added to your body classes, like this:
<body class="home blog logged-in ie">
You can then create styles for the browsers you want to target. For example, for Internet Explorer you would use the
.ieclass:body.ie #mydiv { /* Here goes IE fix */ }
<?php
add_filter('body_class','browser_body_class');
function browser_body_class($classes) {
global $is_lynx, $is_gecko, $is_IE, $is_opera, $is_NS4, $is_safari, $is_chrome, $is_iphone;
if($is_lynx) $classes[] = 'lynx';
elseif($is_gecko) $classes[] = 'gecko';
elseif($is_opera) $classes[] = 'opera';
elseif($is_NS4) $classes[] = 'ns4';
elseif($is_safari) $classes[] = 'safari';
elseif($is_chrome) $classes[] = 'chrome';
elseif($is_IE) $classes[] = 'ie';
else $classes[] = 'unknown';
if($is_iphone) $classes[] = 'iphone';
return $classes;
}
?>
Note: If this is your first time adding code snippets in WordPress, then please refer to our guide on how to properly add code snippets in WordPress, so you don’t accidentally break your site.
If you liked this code snippet, please consider checking out our other articles on the site like: 62 best free WordPress blog themes and how to create a contact form in WordPress.
Comments Leave a Reply