Add custom field to wordpress comment form

You may need to add one or more additional fields to your comment form of your wordpress theme. One of the most common questions is how we can add an additional field like a 2+2 =4 or something like that at the end of the comment and make it -somehow- spam free. if you have this question in your head, then this article answer your question, otherwise not to waste your time.

Step 1: make custom comment form

if you look at the comment_form() function in the /wp-includes/comment-template.php you can see the default form of the word press is like :

$commenter = wp_get_current_commenter();

$req = get_option( 'require_name_email' );

$aria_req = ( $req ? " aria-required='true'" : '' );

$fields =  array(
    'author' => '<p class="comment-form-author">
                     <label for="author">
                         '. __('Name').($req ? ' <span class="required">*</span>':'').'
                     </label>

                     <input id="author"
                            name="author"
                            type="text"
                            value="' . esc_attr( $commenter['comment_author'] ) . '"
                            size="30"' . $aria_req . ' />
                 </p>',

    'email'  => '<p class="comment-form-email">
                     <label for="email">
                          '. __( 'Email' ) . ( $req ? ' <span class="required">*</span>' : '' ).'
                     </label>

	            <input id="email"
                           name="email"
                           type="text"
                           value="' . esc_attr(  $commenter['comment_author_email'] ) . '"
                           size="30"' . $aria_req . '/>
                 </p>',

    'url'    => '<p class="comment-form-url">
                    <label for="url">' . __( 'Website' ) . '</label>

                    <input id="url"
                           name="url"
                           type="text"
                           value="' . esc_attr( $commenter['comment_author_url'] ) . '"
                           size="30" />
                    </p>',
	);

we use the same fields for making the my_custom_comment_fields function in the function.php of our theme ( it is better use it in our child theme) and we will add a new field as check_number to the fields array.


function my_custom_comment_fields()
{

    $commenter = wp_get_current_commenter();

    $req = get_option( 'require_name_email' );

    $aria_req = ( $req ? " aria-required='true'" : '' );

    $fields =  array(
        'author' => '<p class="comment-form-author">
                     <label for="author">
                         '. __('Name').($req ? ' <span class="required">*</span>':'').'
                     </label>

                     <input id="author"
                            name="author"
                            type="text"
                            value="' . esc_attr( $commenter['comment_author'] ) . '"
                            size="30"' . $aria_req . ' />
                 </p>',

        'email'  => '<p class="comment-form-email">
                     <label for="email">
                          '. __( 'Email' ) . ( $req ? ' <span class="required">*</span>' : '' ).'
                     </label>

	            <input id="email"
                           name="email"
                           type="text"
                           value="' . esc_attr(  $commenter['comment_author_email'] ) . '"
                           size="30"' . $aria_req . '/>
                 </p>',

        'url'    => '<p class="comment-form-url">
                    <label for="url">' . __( 'Website' ) . '</label>

                    <input id="url"
                           name="url"
                           type="text"
                           value="' . esc_attr( $commenter['comment_author_url'] ) . '"
                           size="30" />
                    </p>',
        'code'    => '<p class="comment-form-check-number">
                    <label for="check-number">
                          ' . __( 'Pleased type the result of 2+2 in the box' ) . '
                    </label>

                    <input id="check-number"
                           name="check_number"
                           type="text"
                           value="' . esc_attr( $commenter['comment_author_check_number'] ) . '"
                           size="1" />
                    </p>',
	);
return $fields;
}

Step 2: Add custom comment fields to the theme

then we add this function to the theme by adding following line to the function.php file

add_filter('comment_form_default_fields','my_custom_comment_fields');

Step 3: Process our new field

for checking the new field that we added recently (check-number), we create a new function as check_comment_number() and if the input didn’t satisfied our needs we will return a error message.

function check_comment_number( $commentdata ) {

	if ( ! isset( $_POST['check_number'] )  ||  $_POST['check_number'] != 4)
	wp_die( __( 'Error: You did not add the checking number.
                     Hit the BACK button of your Web browser and
                     resubmit your comment with the checking number.' ) );
	return $commentdata;
}

and now we have to add this function to the them by adding another line to function.php as:

add_filter('comment_form_default_fields','check_comment_number');

now if you put a comment you have to type number 4 in the check number box.

Update : By mistake I forgot to put “return $fields;” at the end of ” my_custom_comment_fields ” function.

You can download the source from link below:

Download source

5 thoughts on “Add custom field to wordpress comment form

  1. jg

    Thanks for this code! I am trying this method to add a required checkbox to my form. However while the field displays correctly the form still gets submitted if the field is checked. It does not bring up the error field like when the name, email or comment field is missing. What function do I add to ensure the checkbox is ticked, just like how you added an error message for your no. 73 input box.

    Reply

Leave a Reply

Your email address will not be published. Required fields are marked *