post_class() │ WP 2.7.0

Outputs CSS classes characterizing the post. It is used to simplify the layout of the template.

This is a template tag designed to simplify the work of developers for WordPress. The function is used inside an HTML tag and provides it with CSS classes describing the post that the visitor is currently on. For example,
class="post post-4564 category-48"

The function is commonly used for containers that output information about the post (<div id="post"> or <div id="post-123">), in template files such as tags.php, single.php.

For pages where The Loop is used, the function should be used inside the loop.

Use get_post_class() when you need to get the function's result, not output it to the screen.

But keep in mind that in this case you will get an array of classes, not a string!

There is a very similar function body_class(), which also outputs CSS classes, but for the <body> tag.

Where and what classes are added

hentry, post-{$post_id}, type-{$post_type}, status-{$post_status}, {$post_type} — output for all posts. The parts in brackets are replaced with the corresponding variable of the current post;
{$post_type} is NOT output in the admin panel...
sticky — if this is a sticky post, it is output only on the is_home() page. In the admin panel, it outputs status-sticky;
has-post-thumbnail — if the post has a thumbnail;
format-{post format} — if format support is enabled. If the format is not specified, it will output format-standard.
post-password-required — for password-protected posts.
{$taxonomy}-{$slug} — if the post belongs to a taxonomy. $taxonomy will be replaced with the name of the taxonomy, and $slug with the name of the term (taxonomy element). For example: category-blog;
The exception here is the taxonomy post_tag for which the prefix will be tag-, not post_tag-. For example: tag-novosti.

Uses: get_post_class()

1 time — 0.004188 sec (very slow) | 50000 times — 10.89 sec (slow) | PHP 7.0.2, WP 4.4.1

No Hooks.

Returns

null. Text, formed as the class attribute for the HTML tag.

Usage

<div <?php post_class(); ?>>

$class(string/array): One or more classes to add to the others. Classes should be separated by a space.
Default: ''
$post_id(int): ID of the post to which the function will relate.
Default: current post in the loop ($post->ID)

Examples

#1 Basic example

Apply the function to the HTML container containing the post data:

<div id="post-<?php the_ID(); ?>" <?php post_class(); ?>>

We ended up with something like (let the post is in the 'dancing' category):

<div id="post-4564" class="post post-4564 category-48 category-dancing logged-in">

For this example, the following selectors should be used in CSS:

.post {
	/* styles for all posts */
}
.post-4564 {
	/* styles only for the post in ID 4564 */
}
.category-dancing {
	/* styles for all posts from the dancing category */
}

#2 Adding new classes

The function occupies the "class" attribute, so if we need to add our own class to the tag, we need to add it via function by simply writing it in the function parameter:

<div <?php post_class('class-name'); ?>>

As a result, we get

<div class="class-name post post-4564 category-48 category-dancing logged-in">

#3 Adding classes through a filter

To add the names of all the categories the post belongs to as classes, you can use this code:

add_filter( 'post_class', 'category_id_class' );
add_filter( 'body_class', 'category_id_class' );

// add category names as classes to body class and post class functions
function category_id_class( $classes ){
	global $post;

	foreach( get_the_category( $post->ID ) as $category ){

		$classes[] = $category->category_nicename;

		return $classes;
	}
}

#4 Off-cycle use

If we want to get the classes of the specific post, but not the classes of the current-page-post, we can pass the second parameter which contains the ID of the post we need:

<div <?php post_class( '', $post_id ) ?> >

#5 Use an array to add multiple classes:

<?php
$classes = array(
	'class1',
	'class2',
	'class3',
);
?>

<div <?php post_class( $classes ) ?> >

#6 Add multiple classes as string

A simple way to add multiple classes to the default class list, is to just write them space-separated:

<div <?php post_class( 'class1 class2 class3' ) ?> >

Changelog

Since 2.7.0

Introduced.

`post_class() post class` code ^{WP 6.9.1}

wp-includes/post-template.php

function post_class( $css_class = '', $post = null ) {
	// Separates classes with a single space, collates classes for post DIV.
	echo 'class="' . esc_attr( implode( ' ', get_post_class( $css_class, $post ) ) ) . '"';
}