daviesmoore
June 22, 2015 at 8:57 am
EE4 is adding notices into the body class and breaking the body tag:
body class="<div id="espresso-notices"></div>
<div id="espresso-ajax-loading" style="display:none;">
<span class="ee-spinner ee-spin"></span><span style="display:none;">loading...</span>
</div>
<div id="espresso-ajax-notices">
<div id="espresso-ajax-notices-success" class="espresso-ajax-notices success fade-away" style="display:none;">
<a class="close-espresso-notice">×</a>
<p class="espresso-notices-msg"></p>
</div>
<div id="espresso-ajax-notices-attention" class="espresso-ajax-notices attention fade-away" style="display:none;">
<a class="close-espresso-notice">×</a>
<p class="espresso-notices-msg"></p>
</div>
<div id="espresso-ajax-notices-error" class="espresso-ajax-notices error fade-away" style="display:none;">
<a class="close-espresso-notice">×</a>
<p class="espresso-notices-msg"></p>
</div>
</div>
singular-post single loggedin y2015 m06 d22 h08 s-y2015 s-m05 s-d06 s-h07 s-category-news s-author-developer user-administrator windows chrome"
http://iac.daviesmoore.com/news/2015-wir-conference-report/
This was happening on every page/archive/single before the upgrade to 4.7.2, now it’s happening only on single.php.
Josh
June 22, 2015 at 10:41 am
Add New Note to this Reply
Hi Dustin,
I’m sorry for the trouble. Can you check your theme’s templates and let us know how it’s generating the body tag? To fix this, it will help to know if the theme templates are using a hook or template tag within the body class markup.
daviesmoore
June 22, 2015 at 10:48 am
Add New Note to this Reply
It’s generating semantic body classes. Below is the code for generating all semantic classes (it’s long).
function semantic_body( $classes = array() ) {
global $wp_query, $current_user;
//$classes = get_body_class();
// Starts the semantic markup array
$sc = array( 'wpframework' );
// Generic semantic classes for what type of content is displayed
is_front_page() ? $classes[] = 'home' : null; // For the front page, if set
is_home() ? $classes[] = 'blog' : null; // For the blog posts page, if set
is_singular() ? $classes[] = 'singular-' . get_post_type() : null;
is_single() ? $classes[] = 'single' : null;
is_archive() ? $classes[] = 'archive' : null; // For archive based templates: archive.php, author.php, category.php, tag.php
is_date() ? $classes[] = 'date' : null;
is_search() ? $classes[] = 'search' : null;
is_paged() ? $classes[] = 'paged' : null;
is_attachment() ? $classes[] = 'attachment' : null;
is_404() ? $classes[] = 'error404' : null;
is_user_logged_in()? $classes[] = 'loggedin' : null;
!is_user_logged_in()? $classes[] = 'notloggedin' : null;
// Applies the time- and date-based classes (below) to BODY element
semantic_date_classes( time(), $classes );
// Special classes for BODY element when a single post
if ( is_single() ) {
$postID = $wp_query->post->ID;
the_post();
// Adds 'single' class and class with the post ID
$sc[] = 'single postid-' . $postID;
// Adds classes for the month, day, and hour when the post was published
if ( isset( $wp_query->post->post_date ) ) semantic_date_classes( mysql2date( 'U', $wp_query->post->post_date ), $classes, 's-' );
// Adds MIME-specific classes for attachments
if ( is_attachment() ) {
$mime_type = get_post_mime_type();
$mime_prefix = array( 'application/', 'image/', 'text/', 'audio/', 'video/', 'music/' );
$sc[] = 'attachmentid-' . $postID . ' attachment-' . str_replace( $mime_prefix, "", "$mime_type" );
}
// Adds category classes for each category on single posts
if ( $cats = get_the_category() )
foreach ( $cats as $cat )
if ( $cat ) $classes[] = 's-category-' . $cat->slug;
else $classes[] = 's-category-none';
// Adds tag classes for each tags on single posts
if ( $tags = get_the_tags() )
foreach ( $tags as $tag )
if ( $tag ) $classes[] = 's-tag-' . $tag->slug;
else $classes[] = 's-tag-none';
// Adds author class for the post author
if ( get_the_author_meta('user_login') ) $s_author = sanitize_title_with_dashes( strtolower( get_the_author_meta('user_login') ) );
else $s_author = 'none';
$classes[] = 's-author-' . $s_author;
rewind_posts();
// Adds author role for logged in user
global $current_user;
$user_roles = $current_user->roles;
$user_role = array_shift($user_roles);
if ( is_user_logged_in() ) $user = sanitize_title_with_dashes( strtolower( $user_role ) );
else $user = 'anonymous';
$classes[] = 'user-' . $user;
rewind_posts();
}
// Author name classes for BODY on author archives
elseif ( is_author() ) {
$author = $wp_query->get_queried_object();
$classes[] = 'author';
if ( $author ) $classes[] = 'author-' . $author->user_nicename;
else $classes[] = 'author-none';
}
// Category name classes for BODY on category archvies
elseif ( is_category() ) {
$cat = $wp_query->get_queried_object();
$classes[] = 'category';
if ( $cat ) $classes[] = 'category-' . $cat->slug;
else $classes[] = 'category-none';
}
// Tag name classes for BODY on tag archives
elseif ( is_tag() ) {
$tags = $wp_query->get_queried_object();
$classes[] = 'tag';
if ( $tags ) $classes[] = 'tag-' . $tags->slug;
else $classes[] = 'tag-none';
}
// Page author for BODY on 'pages'
elseif ( is_page() ) {
$pageID = $wp_query->post->ID;
$page_children = wp_list_pages( "child_of=$pageID&echo=0" );
if ( !$pageID )
$pageID = 0;
$page_children = 0;
the_post();
$classes[] = 'page pageid-' . $pageID;
$classes[] = 'page-author-' . sanitize_title_with_dashes( strtolower( get_the_author_meta( 'user_login' ) ) );
// Checks to see if the page has children and/or is a child page; props to Adam
if ( $page_children ) $classes[] = 'page-parent';
if ( $wp_query->post->post_parent ) $classes[] = 'page-child parent-pageid-' . $wp_query->post->post_parent;
if ( is_page_template() ) $classes[] = 'page-template ' . str_replace( '.php', '', get_post_meta( $pageID, '_wp_page_template', true ) );
rewind_posts();
}
// Page author for BODY on 'pages'
elseif ( is_page() ) {
$pageID = $wp_query->post->ID;
$page_children = wp_list_pages( "child_of=$pageID&echo=0" );
the_post();
$sc[] = 'page pageid-' . $pageID;
$sc[] = 'page-author-' . sanitize_title_with_dashes( strtolower( get_the_author_meta( 'user_login' ) ) );
// Checks to see if the page has children and/or is a child page; props to Adam
if ( $page_children )
$sc[] = 'page-parent';
if ( $wp_query->post->post_parent )
$sc[] = 'page-child parent-pageid-' . $wp_query->post->post_parent;
if ( is_page_template() ) // Hat tip to Ian, themeshaper.com
$sc[] = 'page-template page-template-' . str_replace( '.php', '-php', get_post_meta( $pageID, '_wp_page_template', true ) );
rewind_posts();
}
// For when a visitor is logged in while browsing
if ( $current_user->ID ) $sc[] = 'loggedin';
// Paged classes; for 'page X' classes of index, single, etc.
if ( ( ( $page = $wp_query->get( 'paged' ) ) || ( $page = $wp_query->get( 'page' ) ) ) && $page > 1 ) {
$sc[] = 'paged-' . $page;
if ( is_single() ) $sc[] = 'single-paged-' . $page;
elseif ( is_page() ) $sc[] = 'page-paged-' . $page;
elseif ( is_category() ) $sc[] = 'category-paged-' . $page;
elseif ( is_tag() ) $sc[] = 'tag-paged-' . $page;
elseif ( is_date() ) $sc[] = 'date-paged-' . $page;
elseif ( is_author() ) $sc[] = 'author-paged-' . $page;
elseif ( is_search() ) $sc[] = 'search-paged-' . $page;
}
// A little browser detection shall we?
$browser = $_SERVER[ 'HTTP_USER_AGENT' ];
// Mac, PC ...or Linux?
if ( preg_match( "/Mac/", $browser ) ) $classes[] = 'mac';
elseif ( preg_match( "/Windows/", $browser ) ) $classes[] = 'windows';
elseif ( preg_match( "/Linux/", $browser ) ) $classes[] = 'linux';
else $classes[] = 'unknown-os';
// Checks browsers in this order: Chrome, Safari, Opera, MSIE, FF
// Then, get the browser's version number
if ( preg_match( "/Chrome/", $browser ) ) {
$classes[] = 'chrome';
preg_match( "/Chrome\/(\d.\d)/si", $browser, $matches);
} elseif ( preg_match( "/Safari/", $browser ) ) {
$classes[] = 'safari';
preg_match( "/Version\/(\d.\d)/si", $browser, $matches);
$sf_version = 'sf' . str_replace( '.', '-', $matches[1] );
$classes[] = $sf_version;
} elseif ( preg_match( "/Opera/", $browser ) ) {
$classes[] = 'opera';
preg_match( "/Opera\/(\d.\d)/si", $browser, $matches);
$op_version = 'op' . str_replace( '.', '-', $matches[1] );
$classes[] = $op_version;
} elseif ( preg_match( "/MSIE/", $browser ) ) {
$classes[] = 'msie';
if( preg_match( "/MSIE 6.0/", $browser ) ) $classes[] = 'ie6';
elseif ( preg_match( "/MSIE 7.0/", $browser ) ) $classes[] = 'ie7';
elseif ( preg_match( "/MSIE 8.0/", $browser ) ) $classes[] = 'ie8';
elseif ( preg_match( "/MSIE 9.0/", $browser ) ) $classes[] = 'ie9';
elseif ( preg_match( "/MSIE 10.0/", $browser ) ) $classes[] = 'ie10';
} elseif ( preg_match( "/Firefox/", $browser ) && preg_match( "/Gecko/", $browser ) ) {
$classes[] = 'firefox';
preg_match( "/Firefox\/(\d)/si", $browser, $matches);
$ff_version = 'ff' . str_replace( '.', '-', $matches[1] );
$classes[] = $ff_version;
} elseif ( preg_match("/Trident\/7.0;(.*)rv:11.0/", $_SERVER["HTTP_USER_AGENT"], $match) != 0 ) {
$classes[] = 'ie11';
} else $classes[] = 'unknown-browser';
$classes = join( ' ', apply_filters( 'semantic_body', $classes ) ); // Available filter: semantic_body
$print = apply_filters( 'semantic_body_print', false ); // Available filter: semantic_body_print
// And tada!
if ( !$print ) echo $classes;
else return $classes;
}
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;
}
Josh
June 22, 2015 at 11:42 am
Add New Note to this Reply
Hi Dustin,
One option you have is you could change the tag in header.php where it marks up the body tag and change it to this:
<body <?php body_class(); ?>>
Also, if you check out a more recent version of the wp-framework theme, they’ve updated their semantic-markup classes so if you want it to output the semantic body classes, you can update your code to use the WP-Framework’s wpf_filter_body_class() function.