Altering Comment Markup

Changing the default markup for comments can be difficult in WordPress. The wp_list_comments function has useful parameters for avatar size and reply text label, but if you want to make more structural changes (like moving the timestamp to below the comment body, or altering class names) you basically need to recreate the function inside a custom callback.

To me it makes more sense to have markup inside of a template file (rather than a function), and when looking at the Hybrid Theme by Justin Tadlock I saw it does exactly this. In Hyrbid, devlopers can use a custom comment.php template to alter comment markup. So, how it this done?

First, let’s specify a custom callback for wp_list_comments.

	wp_list_comments( array(
		'style' => 'ol',
		'short_ping' => true,
		'avatar_size' => 50,
		'callback' => 'prefix_comment_callback'
	) );

Once we’re inside the custom callback function, we’ll want to call the theme template to use:

 * Use a template for individual comment output
 * @param object $comment Comment to display.
 * @param int    $depth   Depth of comment.
 * @param array  $args    An array of arguments.
function prefix_comment_callback( $comment, $args, $depth ) {
	include( locate_template('comment.php') );

Note that we’re using “include” rather than “get_template_part” so that we can use all the variables available to the callback function.

We now need to take the markup that the default callback uses and paste that into comment.php. You can find that in the WordPress core file “/wp-includes/comment-template.php” in the function html5_comment. Here’s the version I used from 3.9.1.

Once that is pasted into the comment.php, you can move items around as you choose. Make sure to add text domains for any translated text if your theme will be used by international users!

About Devin

I'm a WordPress developer based in Austin, Texas. I run a little theme shop called DevPress and work for a startup called Cratejoy. Find me on twitter @devinsays.

2 Responses

Leave a Reply