Matt Banks

Adding Conditional Classes to the HTML Tag in Genesis 2.0

August 19, 2013 | 1 Minute Read

Have you upgraded to Genesis 2.0 and love the new HTML5 features, but want to target older Internet Explorer versions with classes like with HTML5 Boilerplate? Just drop this code into your child theme's functions.php file and you're off and running.

/**
 * HTML5 DOCTYPE
 * removes the default Genesis doctype, adds new html5 doctype with IE8 detection
*/

function mb_html5_doctype() {
?>
<!DOCTYPE html>
<!--[if IE 8]> <html class="lt-ie9" <?php language_attributes( 'html' ); ?>> <![endif]-->
<!--[if gt IE 8]><!--> <html <?php language_attributes( 'html' ); ?>> <!--<![endif]-->
<head>
<meta charset="<?php bloginfo( 'charset' ); ?>" />
<?php
}

remove_action( 'genesis_doctype', 'genesis_do_doctype' );
add_action( 'genesis_doctype', 'mb_html5_doctype' );

If you want to target IE7 or below, you can add those classes in as well (I’m only targeting IE8 here since I don’t support IE7 and below).

This code is part of my base Genesis Child Theme on Github as well.