How to add a “Review title” field on WooCommerce reviews form?

Question

I want to add a custom field to my reviews form on WooCommerce just like this image:

And then how to get the output of that title just like that:

I just kn

Answer 1

It's too good to find a solution myself, this my answer of what I'm looking for, maybe can help you!

1) Go to your functions.php on your parent or child theme then paste that code below to add the custom field "Review title" on reviews comment form:

function add_review_title_field_on_comment_form() {
    echo '<p class="comment-form-title uk-margin-top"><label for="title">' . __( 'Review title', 'text-domain' ) . '</label><input class="uk-input uk-width-large uk-display-block" type="text" name="title" id="title"/></p>';
}
add_action( 'comment_form_logged_in_after', 'add_review_title_field_on_comment_form' );
add_action( 'comment_form_after_fields', 'add_review_title_field_on_comment_form' );

2) Save that field value on wp_commentmeta table on the database by adding this code just above our last code:

add_action( 'comment_post', 'save_comment_review_title_field' );
function save_comment_review_title_field( $comment_id ){
    if( isset( $_POST['title'] ) )
      update_comment_meta( $comment_id, 'title', esc_attr( $_POST['title'] ) );
}

3) If you want to retrieve that field output value use that code below:

var $title = get_comment_meta( $comment->comment_ID, "title", true );
echo $title;

Note: it works only on comments loop!

4) To add that field output before each comment text, you have to create a new function on functions.php just like this:

function get_review_title( $id ) {
    $val = get_comment_meta( $id, "title", true );
    $title = $val ? '<strong class="review-title">' . $val . '</strong>' : '';
    return $title;
}

And then be sure to add this code below to that WooCommerce template file review.php or you can use woocommerce_review_before_comment_meta hook, but in my case, I've written that code: echo get_review_title( $comment->comment_ID );

just after

do_action( 'woocommerce_review_before_comment_meta', $comment );

I hope that help you!