Displaying What Time Ago a Post or Comment Is Published in WordPress

Showing how long ago a post or comment was published is a popular feature that improves user engagement and readability on WordPress sites. Instead of displaying a static date and time, you can show dynamic, human-friendly timestamps like “5 minutes ago” or “2 days ago.” This guide explains how to quickly implement this feature for both posts and comments using WordPress functions and custom code snippets.

Quick Fix

Use WordPress’s built-in human_time_diff() function to calculate the time difference between the current time and the post or comment date.
Modify your theme’s template files (e.g., single.php for posts, comments.php for comments) to replace the static date with a dynamic “time ago” string.
Optionally, add CSS styling to ensure the new timestamps fit your site’s design.

Why This Happens

By default, WordPress displays the published date and time in a fixed format (e.g., “March 15, 2024 at 3:00 pm”). While precise, this format can be less intuitive for users who want to quickly understand how recent a post or comment is. Using relative time (“time ago”) improves readability and user experience by providing context at a glance.

Step-by-step

1. Displaying “Time Ago” for Posts

Edit your theme’s single.php or wherever the post date is displayed. Replace the existing date output with the following code snippet:

<?php
$time_diff = human_time_diff( get_the_time('U'), current_time('timestamp') );
echo sprintf( esc_html__( '%s ago', 'your-text-domain' ), $time_diff );
?>

This code calculates the difference between the post’s publish time and the current time, then outputs it in a localized “X ago” format.

2. Displaying “Time Ago” for Comments

Edit your theme’s comments.php file or wherever comment dates are shown. Replace the comment date output with:

<?php
$comment_time = get_comment_time('U');
$time_diff = human_time_diff( $comment_time, current_time('timestamp') );
echo sprintf( esc_html__( '%s ago', 'your-text-domain' ), $time_diff );
?>

3. Optional: Adding a Title Attribute for Exact Date

For accessibility and clarity, you can add a tooltip showing the exact date on hover:

<?php
$exact_date = get_the_date();
$time_diff = human_time_diff( get_the_time('U'), current_time('timestamp') );
?>
<time title="<?php echo esc_attr( $exact_date ); ?>">
  <?php echo sprintf( esc_html__( '%s ago', 'your-text-domain' ), $time_diff ); ?>
</time>

Discussion Settings & Styling

WordPress’s Discussion settings do not affect how dates are displayed but control comment moderation and display options. To style the “time ago” text, add CSS targeting the <time> tag or a custom class you add around the timestamp.

Example CSS:

time.time-ago {
  color: #666;
  font-style: italic;
  font-size: 0.9em;
}

Wrap your PHP output in a <time class="time-ago"> tag for styling:

<time class="time-ago" title="<?php echo esc_attr( $exact_date ); ?>">
  <?php echo sprintf( esc_html__( '%s ago', 'your-text-domain' ), $time_diff ); ?>
</time>

Code Snippets

Here are reusable functions you can add to your theme’s functions.php or a custom plugin for cleaner templates.

/**
 * Returns a formatted "time ago" string for a post.
 *
 * @param int|null $post_id Post ID. Defaults to current post.
 * @return string Human-readable time ago string.
 */
function get_post_time_ago( $post_id = null ) {
    $post_id = $post_id ? $post_id : get_the_ID();
    $time_diff = human_time_diff( get_post_time('U', false, $post_id), current_time('timestamp') );
    return sprintf( esc_html__( '%s ago', 'your-text-domain' ), $time_diff );
}

/**
 * Returns a formatted "time ago" string for a comment.
 *
 * @param int|null $comment_id Comment ID. Defaults to current comment in loop.
 * @return string Human-readable time ago string.
 */
function get_comment_time_ago( $comment_id = null ) {
    $comment = $comment_id ? get_comment( $comment_id ) : get_comment();
    $time_diff = human_time_diff( strtotime( $comment->comment_date_gmt ), current_time('timestamp') );
    return sprintf( esc_html__( '%s ago', 'your-text-domain' ), $time_diff );
}

Usage in templates:

<?php echo get_post_time_ago(); ?>

<?php echo get_comment_time_ago(); ?>

Common Pitfalls

Timezones: Always use current_time('timestamp') instead of time() to respect WordPress timezone settings.
Translation: Wrap strings in esc_html__() or similar functions for localization.
Theme Overrides: Some themes hardcode dates in JavaScript or use custom functions—check your theme’s documentation before editing.
Caching: If you use caching plugins, dynamic “time ago” values may not update frequently. Consider using JavaScript for live updates if needed.

Test & Verify

Clear your site cache and browser cache.
Visit a single post page and verify the post date shows as “X ago.”
View comments and confirm comment dates also display “X ago.”
Hover over the timestamp to see the exact date if you added the title attribute.
Test on different devices and browsers to ensure consistent display.

Wrap-up

Displaying “time ago” for posts and comments in WordPress is