Changing position of cancel_comment_reply_link and other elements of comment form

Question

How would I move elements of the WordPress comment form, which is called in comments.php with the following:

<?php comment_form(); ?>

For instance, I'd like to wrap cancel_comment_reply_link in h4 tags and place it below get_post_reply_link. But I don't see any way to do it.

Formerly, all the code for the comment form was there in comments.php. You could easily move the elements around and place them where you wanted. Now, all of those elements are buried as functions in comments-template.php.

Has someone created a function and callback, similar to the one that exists for wp_list_comments, that provides access to the elements of the comment form?

If so, we might more easily edit the code to move links, labels and fields.

Answer 1

I think your best bet is to take a look at Otto's post all about the comment form and functions, here: http://ottopress.com/2010/wordpress-3-0-theme-tip-the-comment-form/

If you want to cut to the chase, you can add this function to your functions.php:

function my_fields($fields) {
$fields['new'] = '<p>Some new input field here</p>';
return $fields;
}
add_filter('comment_form_default_fields','my_fields');

Then set new defaults, changing your HTML and Class/ID's as you like:

$defaults = array(
    'fields'               => apply_filters( 'comment_form_default_fields', $fields ),
    'comment_field'        => '<p class="comment-form-comment">...',
    'must_log_in'          => '<p class="must-log-in">...',
    'logged_in_as'         => '<p class="logged-in-as">...',
    'comment_notes_before' => '<p class="comment-notes">...',
    'comment_notes_after'  => '<dl class="form-allowed-tags">...',
    'id_form'              => 'commentform',
    'id_submit'            => 'submit',
    'title_reply'          => __( 'Leave a Reply' ),
    'title_reply_to'       => __( 'Leave a Reply to %s' ),
    'cancel_reply_link'    => __( 'Cancel reply' ),
    'label_submit'         => __( 'Post Comment' ),
);

In this case, I'm unsure if you can apply a class or ID directly to the "cancel reply link". You can try wrapping it in a <span> tag here, or just use some creative javascript to find it and apply a class:

$('a:contains("Cancel Reply")').addClass('cancel-reply-link');