Unser Affiliate Theme ist da! Spare 10% mit dem Gutschein DRWP10 - mehr erfahren!

Erweitere die body_class()-Funktion um Browser und Betriebssystem spezifische Klassen

Ihr wollt verschiedene Browser oder sogar Betriebssysteme wie Linux, Windows oder Devices wie ein iPhone speziell mit CSS ansprechen? Mit diesem kleinen Snippet wird das zum Kinderspiel!

Das Snippet fügt den aktuellen Browser und das Betriebssystem in die Funktion body_class von WordPress ein. Das erleichtert das arbeiten mit verschiedenen Systemen ungemein.

Fügt einfach die folgenden Codezeile in eure functions.php hinzu:

function drwp_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';
		if(preg_match('/MSIE ([0-9]+)([a-zA-Z0-9.]+)/', $_SERVER['HTTP_USER_AGENT'], $browser_version))
			$classes[] = 'ie'.$browser_version[1];
	} else $classes[] = 'unknown';
	if($is_iphone) $classes[] = 'iphone';
	if ( stristr( $_SERVER['HTTP_USER_AGENT'],"android") ) {
		 $classes[] = 'android';
    } else if ( stristr( $_SERVER['HTTP_USER_AGENT'],"mac") ) {
		 $classes[] = 'osx';
	} elseif ( stristr( $_SERVER['HTTP_USER_AGENT'],"linux") ) {
		 $classes[] = 'linux';
	} elseif ( stristr( $_SERVER['HTTP_USER_AGENT'],"windows") ) {
		 $classes[] = 'windows';
	}
	
	return $classes;
}
add_filter('body_class','drwp_browser_body_class');

Damit das body-Tag auch die entsprechenden Klassen erhält, muss dies Funktion body_class() gesetzt sein:

<body <?php body_class(); ?>>

Happy CSS’ing!

Über Christian

Die Webentwicklung ist seit 2006 ein großer Teil meines Lebens und seit 2010 kann ich damit auch meine Brötchen verdienen. Ich beschäftige mich speziell mit WordPress und entwickle auch eigene Themes. Die Anpassungsfähigkeit von Wordpress begeistert mich immer wieder, daher möchte ich euch interessante Snippets und Plugins nicht vorenthalten.

WordPress Affiliate ThemeAnzeige

Keine Kommentare vorhanden

Hinterlasse eine Antwort

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind markiert *

Du kannst folgende HTML-Tags benutzen: <strong>, <em>, <u>, <a href="">, <del>, <ul>, <ol>, <blockquote>. Für Code benutze bitte pastebin.com und kopiere den Link in dein Kommentar.
*
*