Creating Your Own WordPress Comment Form

The comment section is probably one of the most important parts of any WordPress theme. It’s the only way that users can interact with you and your posts. Without it, you wouldn’t be able to have any feedback whatsoever. Even so, it is an often overlooked file. With the newish comments template you can have a working comment system with only one line of code, which is a huge improvement over the old long ‘foreach’ statement. But, what if you want to change things up a bit from the default comment template? Well, that’s why I’m here. Throughout this post I’ll explain the different parts of the new comment template, and show you some cool tricks to customize it.

We’re all pretty familiar with the old WordPress comment form.

Long foreach PHP Statement

That’s really all you need to know about the old comments template. The old comments template was just a big jumble of code that was completely incomprehensible by those who didn’t know any PHP. It worked just fine, but it wasn’t easy to customize or understand for the average user. Now, upgrading your comments.php file is incredibly easy. Just replace the entire foreach statement with this function :

 wp_list_comments( );

This should be within php tags of course.
To make your theme up to date, you could just do that, but you’ll probably want to download the default comments.php file from WordPress.org if you’re starting a new theme.

Well, that seemed pretty easy. But the first thing that’s going to confuse you is where you make your edits. Well, it’s easier than you may think, and I’ll so you how to get everything you could with the old template and much more.

So with the old comments template, you could just add a line of code to display a gravatar or something. What now? Well, that’s what I’m going to teach you.

Ok, so you have all of your current files. First things first, you need to add the following somewhere in the head of the header.php file. It makes the threaded comments work correctly.

 if ( is_singular() ) wp_enqueue_script( comment-reply ); wp_head();

This should be within php tags of course.
Now, that you have a completely working and current, comment template, it’s time to customize it. Unless you like the default style of comments.

1. Open comments.php
You need to replace the wp_list_comments function with the following -

wp_list_comments('type=comment&callback=theme_comment');

This should be within php tags of course.
This is defining a function for our custom comment form that will be in the functions.php file. Of course, if you don’t like the fact that code related to comments isn’t in the comments.php file you can move it there, but this is how I did it.

2. Ok open up functions.php, if you don’t already have one, just create one.
Insert the following code -

function theme_comment($comment, $args, $depth) {
   $GLOBALS['comment'] = $comment; ?>
	<li> id="comment-"&gt;</li>

Everything inside your li tags is what is displayed for each single comment. Keep in mind, this is just the individual comments, things like the comment submission form should go above or below the function in your comments.php file.
Anyway, here’s a quick rundown on everything you just put in your functions.php file.

The comment_class(); function displays all the classes for the comments, and there are a lot of them. The comment_ID() just displays the comments ID number. Simple right?

Now, it’s all up to you. But I won’t leave you up a river without a paddle, I’m going to give you some useful snippets of code that you should definitely use in your comments template. These, and much more can of course be found on WordPress.org.

1. Gravatar

 echo get_avatar($comment,$size='80',$default='
' );

This should be within php tags of course.

Displays the gravatar of the comment author. Just edit the size, and the path to url.

2. Comment Time

comment_date('F jS, Y');

This should be within php tags of course.

Displays the time that the comment was left.

3. Reply to Comment link

comment_reply_link(array_merge( $args, array('reply_text' => 'REPLY ', 'depth' => $depth, 'max_depth' => $args['max_depth'])));

This should be within php tags of course.

If you want to take advantage of the threaded comments, you’ll need this. It allows users to reply to individual comments. The result is a nested list, so make sure to code your CSS and markup accordingly. You can of course change the text that is displayed in the link.

4. Comment Text

comment_text();

This should be within php tags of course.

You won’t get many comments without this. It displays the text of the comment, rather basic,

5. Comment Status

comment_approved == '0') : ?>
<em></em>

This displays the status of your comments. I.e. If it’s awaiting moderation or not. You should place this code above your comment text.

6. Edit Comment Link

edit_comment_link('Edit');

This should be within php tags of course.

This allows the Administrator quick access to editing individual comments. Helps with spam, and whatnot.

7. Author Comment Style

You may want the author to have their own special style of comments. Luckily, that’s already built into WordPress, so all you need to do is target the CSS class in your style.css file.
The class you want to use is bypostauthor.
In case you also want certain users to have specially colored comments, use comment-author-USERNAME

Wrapup

Well, hope you found this tutorial useable. Because I know I’ll get comments about this, yes I know 2.7 was released awhile ago, but it’s never to late to write a tutorial on something from it. If you want to see the finished result, scroll down and leave me a comment.