post_class( string|array $class = '', int|WP_Post $post_id = null )

Displays the classes for the post container element.

Contents

Description Description

Parameters Parameters

$class

(string|array) (Optional) One or more classes to add to the class list.

Default value: ''

$post_id

(int|WP_Post) (Optional) Post ID or post object. Defaults to the global $post.

Default value: null

Top ↑

Source Source

File: wp-includes/post-template.php

440
441
442
443
function post_class( $class = '', $post_id = null ) {
    // Separates classes with a single space, collates classes for post DIV
    echo 'class="' . join( ' ', get_post_class( $class, $post_id ) ) . '"';
}

Expand full source code Collapse full source code View on Trac

Top ↑

Changelog Changelog

Changelog
Version Description
2.7.0 Introduced.

Top ↑

Top ↑

Uses Uses

Uses
Uses Description
wp-includes/post-template.php: get_post_class()

Retrieves an array of the class names for the post container element.

Top ↑

User Contributed Notes User Contributed Notes

  1. Skip to note 1 content
    You must log in to vote on the helpfulness of this noteVote results for this note: 3You must log in to vote on the helpfulness of this note
    Contributed by hearvox —

    Add more classes.
    You can add a class to the post_class defaults:

    1
    <div id="post-<?php the_ID(); ?>" <?php post_class( 'class-name' ); ?>>

    The above prints HTML with your added class and the defaults:

    1
    <div id="post-4564" class="class-name post-4564 post type-post status-publish format-standard hentry category-news">

    Use an array to add multiple classes:

    1
    2
    3
    4
    5
    6
    7
    8
    9
    <?php
    $classes = array(
        'class1',
        'class2',
        'class3',
    );
    ?>
     
    <div id="post-<?php the_ID(); ?>" <?php post_class( $classes ); ?>>
  2. Skip to note 2 content
    You must log in to vote on the helpfulness of this noteVote results for this note: 1You must log in to vote on the helpfulness of this note
    Contributed by hearvox —

    To print post_class CSS classes for a post other then the current one, specify its ID (integer):

    1
    <?php post_class( '', 22 ); ?>

    The above prints (depending on category and tags):
    class="post-22 post type-post status-publish format-standard hentry category-another-cat tag-tag1 tag-tag2

  4. Skip to note 4 content
    You must log in to vote on the helpfulness of this noteVote results for this note: -1You must log in to vote on the helpfulness of this note
    Contributed by hearvox —

    Example of the template tag (and its default CSS classes).
    This example shows the post_class template tag as commonly used in a theme file (such as single.php):

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

    The output of the above prints this HTML (for a post in the ‘news’ category and a theme that supports Post Formats):

    1
    <div id="post-4564" class="post-4564 post type-post status-publish format-standard hentry category-news">

    Using these CSS classes you can then style this specific post, or all posts assigned the same category (or post format):

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    .post {
        /* Styles for all posts */
    }
     
    .post-4564 {
        /* Styles for only this post (ID number 4564) */
    }
     
    .category-news {
        /* Styles for all posts in the 'news' category  */
    }
     
    .format-standard {
        /* Styles for all posts assigned the post-format of 'standard'  */
    }

    Expand full source codeCollapse full source code

You must log in before being able to contribute a note or feedback.