Edit WordPress Comments Output To Display in Time Ago Format

If you ever wanted to Edit WordPress Comments time format, we are going to show you a simple trick to achieve this. To display a comment time in a user friendly time ago wordpress format, there are two approaches that can be taken.

  1. Modify Comment Time Output With a Filter
  2.  Overriding the Comments Markup, so you can modify the comments output the way you want.
Modify Comment Time Output With a Filter

This method allows you to hook into the comment time output with a simple function to override time display. You can use it to hook into any template, you just need to copy following function into your functions.php of your (preferable) child theme:

/**
 * Modify the comment date of the current comment.
 *
 * @param string          $d          Optional. The format of the date. Default user's setting.
 * @param int|WP_Comment  $comment_ID WP_Comment or ID of the comment for which to get the date.
 *                                    Default current comment.
 * @return string The comment's date.
 */
function pressfore_comment_time_output($date, $d, $comment){
	return sprintf( _x( '%s ago', '%s = human-readable time difference', 'your-text-domain' ), human_time_diff( get_comment_time( 'U' ), current_time( 'timestamp' ) ) );
}
add_filter('get_comment_date', 'pressfore_comment_time_output', 10, 3);

So to break this down, we are hooking into get_comment_date filter which is returning the output of comment time format. This filter accepts 3 parameters, but we wont be using any, since we are overriding the old format with new one. What we are returning is the time ago wordpress function which will create desired format – WordPress Codex Source Page .

Cons of this approach can be that it will only affect comment time, but not the date markup. Next to the time there will be other data, depending on the current theme you are using. So if you do not want more data displayed next to your new time ago wordpress format, you can go to the second method – Overriding the Comments Markup – to edit WordPress comments output.

Overriding the Comments Markup

This approach will allow you to completely edit WordPress comments output if you want, or just the part you want – Posted On format.

This is default wordpress comments markup (html5), taken from the Walker_Comment class. But if you are using some theme which is already modifying the comments output then you will need to override that function. This is best done from a child function, you just need to search in your current theme where the function similar to the one bellow is included.

So to modify the comments use this function:


/**
 * Outputs a modified comment markup.
 *
 *
 * @see wp_list_comments()
 *
 * @param WP_Comment $comment Comment to display.
 * @param int        $depth   Depth of the current comment.
 * @param array      $args    An array of arguments.
 */
function pressfore_modify_comment_output( $comment, $depth, $args ) {
	$tag = ( 'div' === $args['style'] ) ? 'div' : 'li';
	?>
	<<?php echo $tag; ?> id="comment-<?php comment_ID(); ?>" <?php comment_class( empty( $args['has_children'] ) ? '' : 'parent', $comment ); ?>>
	<article id="div-comment-<?php comment_ID(); ?>" class="comment-body">
		<footer class="comment-meta">
			<div class="comment-author vcard">
				<?php if ( 0 != $args['avatar_size'] ) echo get_avatar( $comment, $args['avatar_size'] ); ?>
				<?php
				/* translators: %s: comment author link */
				printf( __( '%s <span class="says">says:</span>' ),
						sprintf( '<b class="fn">%s</b>', get_comment_author_link( $comment ) )
				);
				?>
			</div><!-- .comment-author -->

			<div class="comment-metadata">
				<a href="<?php echo esc_url( get_comment_link( $comment, $args ) ); ?>">
					<time datetime="<?php comment_time( 'c' ); ?>">
						<?php
						printf( _x( '%s ago', '%s = human-readable time difference', 'your-text-domain' ), human_time_diff( get_comment_time( 'U' ), current_time( 'timestamp' ) ) );
						?>
					</time>
				</a>
				<?php edit_comment_link( __( 'Edit' ), '<span class="edit-link">', '</span>' ); ?>
			</div><!-- .comment-metadata -->

			<?php if ( '0' == $comment->comment_approved ) : ?>
				<p class="comment-awaiting-moderation"><?php _e( 'Your comment is awaiting moderation.' ); ?></p>
			<?php endif; ?>
		</footer><!-- .comment-meta -->

		<div class="comment-content">
			<?php comment_text(); ?>
		</div><!-- .comment-content -->

	</article><!-- .comment-body -->
	<?php
}

 

You can add it to the functions.php of your child theme. Then you need to call this function as the callback function from the wp_list_comments() function. This function is usually called inside the comments.php. So you will need to copy this template from parent function, and modify it from child theme. This way you can also check if there is some custom function already written inside the theme to edit WordPress comments. You will see this by checking if there is 'callback' parameter passed in arguments inside this function. If there is not, you can pass it, like this :
wp_list_comments("callback=pressfore_modify_comment_output");

You can read more about this function here – https://codex.wordpress.org/Function_Reference/wp_list_comments

So to break this down, the part you will be modifying is inside the <time> tag. This is the part which is modified –

<time datetime="<?php comment_time( 'c' ); ?>">
<?php
printf( _x( '%s ago', '%s = human-readable time difference', 'your-text-domain' ), human_time_diff( get_comment_time( 'U' ), current_time( 'timestamp' ) ) );
?>
</time>

Instead of default one :

<time datetime="<?php comment_time( 'c' ); ?>">
<?php
/* translators: 1: comment date, 2: comment time */
printf( __( '%1$s at %2$s' ), get_comment_date( '', $comment ), get_comment_time() );
?>
</time>

If you find this article useful do not forget to like and share it. And if you have any questions or suggestion drop us a comment bellow.
Thanks for reading

Leave a Comment

Your email adress will not be published. All fields are required

HTML is not allowed