Place the code bellow in your theme’s functions.php file.

function commentCount($type = 'comments'){

	if($type == 'comments'):

		$typeSql = 'comment_type = ""';
		$oneText = 'One comment';
		$moreText = '% comments';
		$noneText = 'No Comments';

	elseif($type == 'pings'):

		$typeSql = 'comment_type != ""';
		$oneText = 'One pingback/trackback';
		$moreText = '% pingbacks/trackbacks';
		$noneText = 'No pinbacks/trackbacks';

	elseif($type == 'trackbacks'):

		$typeSql = 'comment_type = "trackback"';
		$oneText = 'One trackback';
		$moreText = '% trackbacks';
		$noneText = 'No trackbacks';

	elseif($type == 'pingbacks'):

		$typeSql = 'comment_type = "pingback"';
		$oneText = 'One pingback';
		$moreText = '% pingbacks';
		$noneText = 'No pingbacks';

	endif;

	global $wpdb;

    $result = $wpdb->get_var('
        SELECT
            COUNT(comment_ID)
        FROM
            '.$wpdb->comments.'
        WHERE
            '.$typeSql.' AND
            comment_approved="1" AND
            comment_post_ID= '.get_the_ID()
    );

	if($result == 0):

		echo str_replace('%', $result, $noneText);

	elseif($result == 1): 

		echo str_replace('%', $result, $oneText);

	elseif($result > 1): 

		echo str_replace('%', $result, $moreText);

	endif;

}

Change the $oneText, $moreText, $noneText variable values to suit your needs. The percentage character (%) can be used in all of the variables and will be replaced with the number.

Using the code

commentCount(); //echoes the comment count

commentCount('comments'); //same as the example on top

commentCount('pings'); //echoes number of trackbacks and pingbacks

commentCount('trackbacks'); //echoes number of trackbacks

commentCount('pingbacks'); //echoes number of pingbacks

If you know a simpler way to do this let me and the readers know in the comments. Thanks.

<?php if ($comments) : ?>

	<ol>

	<?php foreach ($comments as $comment) : ?>

		<li id="comment-<?php comment_ID() ?>" class='commentItem'>
			<!-- THE COMMENT LAYOUT -->
		</li>

	<?php endforeach; /* end for each comment */ ?>

	</ol>

<?php endif; ?>

Above we can see a stripped version of an ordinary comment loop which will show comments, trackbacks and pingbacks all in one place. Let’s change that.

1st Step / Separating

<?php if ($comments) : ?>

	<ol>

	<?php foreach ($comments as $comment) : ?>

		<?php
		$commentType = get_comment_type();
		if($commentType == 'comment') :
		?>

			<li id="comment-<?php comment_ID() ?>" class='commentItem'>
				<!-- THE COMMENT LAYOUT -->
			</li>

		<?php endif;/* end if comment check */ ?>

	<?php endforeach; /* end for each comment */ ?>

	</ol>

<?php endif; ?>

get_comment_type is a function that returns “comment”, “trackback” or “pingback” depending what type the current comment is.

Now just copy paste the same code again and just change “if($commentType == ‘comment’)” to if($commentType != ‘comment’) which is the opposite of “==” and change the class from “commentItem” to “trackbackItem” so you can easily make different styles.

<?php if ($comments) : ?>

	<ol>

	<?php foreach ($comments as $comment) : ?>

		<?php
		$commentType = get_comment_type();
		if($commentType != 'comment') :
		?>

			<li id="comment-<?php comment_ID() ?>" class='trackbackItem'>
				<!-- THE PINGS LAYOUT -->
			</li>

		<?php endif;/* end if NOT comment check */ ?>

	<?php endforeach; /* end for each comment */ ?>

	</ol>

<?php endif; ?>

2nd Step / The Layout

Making the layout for pinbacks/trackbacks is very simple, there is only 1 function we are going to use, comment_author_link(). It just echoes the trackback/pingback link and that’s all we need.

<li id="comment-<?php comment_ID() ?>" class='trackbackItem'>
	<?php comment_author_link(); ?>
</li>

That’s it. Styling is up to you

Notice: The whole comments part is simplified for easier understanding of how to separate this, but you shouldn’t leave out the part where you check if the comment is awaiting moderation or comments are closed.

Why separate?

Thought about going through this before jumping into the code but i decided to put it at the end.

Let’s take a look at 2 screens i made.

All mixed together

The screenshot above is taken from 1stWebDesigner.

The biggest problem in my opinion is that the conversation is broken and can become less useful. Another thing is that some articles can get a big amount of pings and push the comment to far down. And it doesn’t look nice, doesn’t it?

Separated

The screenshot above is taken from the blog you are reading at the moment

As you can see the conversation isn’t broken by the pings. The comment form won’t be pushed to far down if there are many pings. And it looks nice, doesn’t it?

Let me know what you think about this.