Software Developer

Remove hentry from post_class in WordPress

If you are using microdata instead of microformats, you may notice that WordPress automatically adds the class “hentry” to the post_class. This may create errors for you in the Google Structured Data Testing Tool. This Google toole will think you are using microformats since the “hentry” class gets added to your posts. So, even if you have valid microdata (i.e. from schema.org), you will get errors for your incomplete microformats.

If you prefer to use your microdata, the solution is to remove the “hentry” class. The following function will do that. However, you MUST also fix any CSS in your theme that references the “hentry” class. See step 2 below.

Step 1: remove hentry from post_class

This goes in your functions.php.

/**
* Remove hentry from post_class
*/
function isa_remove_hentry_class( $classes ) {
	$classes = array_diff( $classes, array( 'hentry' ) );
	return $classes;
}
add_filter( 'post_class', 'isa_remove_hentry_class' );

Step 2: Replace .hentry in CSS with something else

Since you no longer have the hentry class in your posts, any CSS targeted at the hentry class will no longer work. Replace any selectors that include .hentry with the following:

.status-publish,
.status-draft,
.status-private

This is trickier than you may think. You cannot do a simple search and replace. For example, your CSS might have a selector like this (this is taken from Twenty Fourteen theme):

.hentry .mejs-container

If you wrongfully do a simple search and replace, you will end up with this, (which is wrong):

.status-publish,
.status-draft,
.status-private .mejs-container

Whereas the correct replacement would be:

.status-publish .mejs-container,
.status-draft .mejs-container,
.status-private .mejs-container

Another example from Twenty Fourteen theme:

This:

.hentry .mejs-mediaelement,
.hentry .mejs-container .mejs-controls

should become this:

/* replace line 1 */

.status-publish .mejs-mediaelement,
.status-draft .mejs-mediaelement,
.status-private .mejs-mediaelement,

/* replace line 2 */

.status-publish .mejs-container .mejs-controls,
.status-draft .mejs-container .mejs-controls,
.status-private .mejs-container .mejs-controls

In other words, every single selector that has “.hentry” will be replaced with 3 new selectors. Example 1 had 1 selector, and so it became 3 new ones. Example 2 had 2 selectors, and so it became 6 new ones (2 * 3 = 6). Remember to pay attention to the commas.

Note that in Twenty Fourteen, you will have to make these changes both to style.css and to /css/ie.css.

By

Questions and Comments are Welcome

Your email address will not be published. All comments will be moderated.

Please wrap code in "code" bracket tags like this:

[code]

YOUR CODE HERE 

[/code]