1. Code
  2. Creative Coding

Customizing Comments in WordPress - Functionality and Appearance

Scroll to top
Read Time: 8 min

In WordPress there are different content types like post, page and comments etc. These form the very basics of WordPress. WordPress being a highly customizable platform lets you customize the very basic types to a great extent to suit your site. One can change the look as well as the functionality of the basic types to make them behave and look as per the appearance and functionality of your site. In this article we are going to see how we can change the behavior and appearance of the comments in our WordPress site.

Step 1 Understanding the comment_form Function and Its Arguments

Let's have a look at the WordPress function comment_form. This is responsible for showing the comments form which is mostly displayed on the single page or post in WordPress. A call to this function will be mostly seen in the comments.php file of your theme folder. Then this file would be included at various places like single.php, page.php, etc. directly or by calling the comments_template function.

You can find more details about comments_template in the WordPress Codex.

If we use the comment_form function to display the form, the form will be displayed using the default parameters which will be fields such as name, email (both are compulsory), website and the comment content. On the Twenty Eleven default theme the form will look as follows.

Some of the important arguments to the comment_form function are:

  • fields – By which you can actually control which fields are shown in the comment form.
  • comment_notes_before and comment_notes_after – These are used to display some note before or after the comment form.
  • title_reply – Using this you can change the title of the reply which by default is 'Leave a Reply'.
  • label_submit – This can be used to change the text over the submit button of the comment.

Step 2 Customizing Your Comment Form Using the Function comment_form

Now let's customize our comment form by passing different arguments to comment_form.

In case we want to customize the fields of the comment form we can pass the fields to the comment_form function. The default fields in the comment_form function are as follows:

So in case we want to remove the website field then we need to create the fields without the website field as follows and pass it to the comment_form.

Now if we go and see the comments form it will appear as follows:

In addition to this let's now change the title of reply to 'Please give us your valuable comment' and also change the comment post button title to 'Send My Comment'.

Following are the arguments we will pass to comment_form to achieve this:

Now if we see the comment form it will look as follows:

Step 3 Removing Fields From the Comment for Using Hooks

The WordPress comments form can be customized also using hooks and filters. Customizing using hooks/filters is very useful especially when you are customizing through a plugin and cannot modify the theme files. The filter to add or remove fields from the comments form is 'comment_form_default_fields'

Now let's remove the URL field using this filter. The code to do this you can either put it in your plugin file if you are customizing through the plugin or in the functions.php file of your theme.

The code is as follows:

In this we add the function remove_comment_fields on the 'comment_form_default_fields' filter and then unset the url field to remove the website field.

Step 4 Adding More Data to Your Comments Using Hooks

We can even add fields to the comment for using the 'comment_form_default_fields' filter. Now let's add a comment author's age field using this filter and then store this field as a comment meta and display it on the comment.

We can add a field as follows:

Once we add the field depending on the theme we might want to style it. As I am using the Twenty Eleven theme I style it by adding #respond .comment-form-age label with the other labels style like #respond .comment-form-url label etc. as follows:

Now if we see the comment form the age field will be seen as follows:

Now that the age is stored as the comment meta we need to hook into 'comment_post' and save the age as comment meta as follows:

Once the meta is saved it can be displayed on the comment as follows:

Step 5 Customizing Comments for Some Specific Post Types

It might be sometimes useful to have some comment fields only for specific post types. Now lets make code changes to display the age comment field only if it's a custom post type, like say, book.

The code to have the age only for books custom post type is:

So here you add the field only if it is of type 'Books'.

Step 6 Creating a Callback for Displaying Comments

The function wp_list_comments is used to display the comments on a post. You can read about wp_list_comments in the WordPress Codex.

wp_list_comments has an argument of 'callback' in which you can specify the function to be called back to display the comment.

In the Twenty Eleven theme in comments.php you will see a line:

This we will change to:

So the function my_comments_callback will be called for each post.

Step 7 Styling Your Comments

Now we will style our post a little differently. We just want to display the content of the post and the age field which we have specifically added. We change the background color of the comments also.

The code for function 'my_comments_callback' is as follows:

We also modify the background color as follows:

Now if we see the comments they will look as follows:


Comments play an important role as one is building a community site. Depending on the site the functionality of the comments can also be customized appropriately. WordPress provides a flexible commenting system and provides a good support via functions to change the behavior and appearance of the comments of your site. So have fun customizing your WordPress site!

Let us know in the comments below if you have any other suggestions for how to customize comments on your WordPress site.

Did you find this post useful?
Want a weekly email summary?
Subscribe below and we’ll send you a weekly email summary of all new Code tutorials. Never miss out on learning about the next big thing.
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.