Modifying WordPress Comments Form Fields: Beyond the CSS

I ended up playing around with the CSS some more too to make the form even smaller, but I was also asked to change the form fields and decided to put in some placeholders. While the WordPress documentation for comment_form is pretty good, the example doesn’t clearly tell you how to change form fields. It’s possible I find it less than intuitive because I’m not a programmer.

In my case, I wanted to change the title from “Leave a Reply” to “Leave a Comment”. I also wanted to change the form fields to have placeholder text and make the comments box smaller.

Changing it Once

If you only want to change it in the one file, you can specify the new values just above where you call comment_form().

Let’s start with changing the easy stuff. Much like the WordPress example, just make an array with whichever values you would like to change from the default, and call the comment_form function with your array, which in this example, the form header and comment field are changed.

//for long defaults, such as the comment_field, I suggest copy/pasting the default and then modifying it
$comments_args
= array(
‘title_reply’ => ‘Leave a Comment’,
‘comment_field’ => ‘<p><label for=”comment”>’ . _x( ‘Comment’, ‘noun’ ) . ‘</label><textarea id=”comment” name=”comment” placeholder=”Eggy approves!” cols=”45″ rows=”4″ aria-required=”true”></textarea></p>’
);
comment_form($comments_args);

Changing the other fields makes things a tad more complicated. For other fields, you need to specify another array, then apply your new values in the comments array.

//required variables for changing the fields value
$commenter = wp_get_current_commenter();
$req = get_option( ‘require_name_email’ );
$aria_req = ( $req ? ” aria-required=’true’” : ” );

//name the array whatever you want; I strongly suggest copy/pasting the default then modifying it
$new_fields = array(
‘author’ => ‘<p>’ . ‘<label for=”author”>’ . __( ‘Name’ ) . ‘</label> ‘ . ( $req ? ‘<span>*</span>’ : ” ) .
‘<input id=”author” name=”author” type=”text” placeholder=”Eggy the Ram” value=”‘ . esc_attr( $commenter['comment_author'] ) . ‘” size=”30″‘ . $aria_req . ‘ /></p>’,
‘email’ => ‘<p><label for=”email”>’ . __( ‘Email’ ) . ‘</label> ‘ . ( $req ? ‘<span>*</span>’ : ” ) .
‘<input id=”email” name=”email” type=”text” placeholder=”eggytheram@ryerson.ca” value=”‘ . esc_attr(  $commenter['comment_author_email'] ) . ‘” size=”30″‘ . $aria_req . ‘ /></p>’,
//in this case, we’re applying filters, so it changes all the values. If ‘url’ is not specified, then it gets removed.
);

$comments_args = array(
‘fields’ => apply_filters( ‘comment_form_default_fields’, $new_fields ),
‘title_reply’ => ‘Leave a Comment’,
‘comment_field’ => ‘<p><label for=”comment”>’ . _x( ‘Comment’, ‘noun’ ) . ‘</label><textarea id=”comment” name=”comment” placeholder=”Eggy approves!” cols=”45″ rows=”4″ aria-required=”true”></textarea></p>’
);
comment_form($comments_args);

For a full list of default values in comment_form(), take a look at the Codex Function Reference.

Changing the Defaults

To change the fields for all comment forms, meaning it will change the default values and will be applied whenever you call comment_form(), you can change the defaults using a filter in the functions.php file.

//name it whatever you want
function alter_comment_form($new_defaults) {

//required variables for changing the fields value
$commenter = wp_get_current_commenter();
$req = get_option( ‘require_name_email’ );
$aria_req = ( $req ? ” aria-required=’true’” : ” );

//name the array whatever you want
$new_fields = array(
‘author’ => ‘<p>’ . ‘<label for=”author”>’ . __( ‘Name’ ) . ‘</label> ‘ . ( $req ? ‘<span>*</span>’ : ” ) .
‘<input id=”author” name=”author” type=”text” placeholder=”Eggy the Ram” value=”‘ . esc_attr( $commenter['comment_author'] ) . ‘” size=”30″‘ . $aria_req . ‘ /></p>’,
‘email’ => ‘<p><label for=”email”>’ . __( ‘Email’ ) . ‘</label> ‘ . ( $req ? ‘<span>*</span>’ : ” ) .
‘<input id=”email” name=”email” type=”text” placeholder=”eggytheram@ryerson.ca” value=”‘ . esc_attr(  $commenter['comment_author_email'] ) . ‘” size=”30″‘ . $aria_req . ‘ /></p>’,
//in this case, we’re applying filters, so it changes all the values. If ‘url’ is not specified, then it gets removed.
);

$new_defaults['fields'] = apply_filters(‘comment_form_default_fields’, $new_fields); //changing default fields to the new values in your array
$new_defaults['comment_field'] = ‘<p><label for=”comment”>’ . _x( ‘Comment’, ‘noun’ ) . ‘</label><textarea id=”comment” name=”comment” placeholder=”Eggy approves!” cols=”45″ rows=”4″ aria-required=”true”></textarea></p>’;

$new_defaults['title_reply'] = ‘Leave a Comment‘; //changes the form header text

return $new_defaults;
}

add_filter(‘comment_form_defaults’, ‘alter_comment_form‘); //basically tells it to replace the existing defaults with your new defaults value (where applicable)

If you only want to change the fields or if you want to do it separately from the comments_form_defaults (especially if only changing one field), then you can set new values in a similar way to the new defaults, say:

function alter_comment_form_fields($new_fields) {
    if(isset($fields['url']))
unset($fields['url']);
return $fields;
}
add_filter(‘comment_form_default_fields’, ‘alter_comment_form_fields‘); //make sure to use comment_form_default_fields

Note: In this case, since we’re using the add_filter for the fields (instead of apply), it will only change the values specified.

Since this example only changes the url field, I could’ve actually used the specific field filter (i.e. comment_form_field_url) instead. Near the bottom of the Codex Function Reference page is a list of filter hooks related to comment_form.

The Result

As I mentioned, I edited the CSS further since my last post on editing the TwentyEleven comment form, so now it’s even smaller. It’s now 124px shorter and 84px less wide than my last version for a total of 367px shorter (and 84px less wide).

WP Comments Form Edited version 2

I was also recently reading about adding ‘character’ or ‘personality’ to a website and thought having fun placeholder text would be one small way to do that. (Eggy the Ram is the university’s mascot.)

9 thoughts on “Modifying WordPress Comments Form Fields: Beyond the CSS

  1. Hi! I’m having a lot of trouble changing my text (even though I’ve done it before)… I’ve already typed everything out on a wordpress support forum, if you wouldn’t mind taking a look:

    http://wordpress.org/support/topic/editing-comment-form-labels?replies=5

    No one there can help me. Any ideas on why it worked before and not now? I’m trying to avoid doing anything complicated because I really don’t know what I’m doing!

    Thanks!! :)

    1. I wouldn’t say that no one can help you when you’ve only posted your question for less than a day. Try to be patient. (I’ve seen posts years old that never get answered, which I would then say no one can seem to help.) I also suggest that if you’re getting an error after you’ve tried changing your text, you also post the error for people to see. Seeing error messages help a lot in troubleshooting.

      As to your actual problem, if you want to remove the email field, I don’t see why you wouldn’t just remove the whole input field. Be warned that if you do that, you’ll likely get a lot more spam. I used to get a lot of spam even with the email field on, which is why I require login now.

      1. Thank you for responding :) You’re right, maybe someone else will post back – all of this computer stuff is so overwhelming for me, I do need to be more patient! The thing is: I’m not getting any type of error sign at all. I changed the text, click update, it says it saved – but then when I go to check my site, the old text is still there – which is really confusing for me? I clicked “Empty Cache” on my safari tab and then refreshed the page, but it still says the old text. When I go back into the comments.php – the new text I inserted is there! I’ve since just changed it back so the comments.php text matches what the comment form on the site says – but that doesn’t make any sense to me?

        I would be interested in deleting the whole email field as well possibly, but I don’t know how to do that? I agree with what you’re saying about the spammers, and would rather just change the wording by the email field if I could.

      2. Then my question would be, are you sure you’re changing the right file? The display of comments is not always controlled by the comments.php file. It really depends on how the theme was written, if there were updates, if in the updates old files are deleted, etc. So, the comments could actually be coming from any of the template files.

        I would suggest that you might ask the theme developer for help since they would be the most familiar with how they implemented the comments form (assuming you’re using the newest version). Otherwise, you might get help through an in-person workshop of some sort.

  2. That sounds like a good idea, I’ll try emailing them. I’m not sure that I’m editing from the write place. I’m pretty sure comments.php is where I went before, but that was three months ago so maybe there have been updates since then that have changed things? Because I also altered a lot of the other text (instead of “No comments” when there were no comments, it now says “Start a conversation!” etc.). But now, that doesn’t work. I’ve gone through all of the other .php files on the side of my editor and I don’t see any comment title text anywhere (and I definitely know for a fact I 100% changed things from somewhere in my editor – I don’t know how to open the files other places). Thank you very much for your advice and taking the time to talk to me. Hope you enjoy your weekend!

  3. Hi! Seems a lot like the information I was so feverishly looking for. But though the info is concise, in which files exactly I should make these arrangements in order to change comment box title/strings and so on? And do so that those changes stays upon updating a theme?

    1. Hi Taavi, I suggest you take a look at the comment form function documentation that I linked to near the top of the post: http://codex.wordpress.org/Function_Reference/comment_form

      My post is not meant to be a standalone, but an addition to the codex documentation.

      As it says in the codex, in the default theme(s) it’s in the comments.php file, but depending on the theme you’re using, it might be in any template file. If you’re worried about theme updates overriding your changes, then I suggest you look into creating a child theme rather than making changes to the original theme.

Leave a Comment

Please log in using one of these methods to post your comment:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s