1

I just created a comments.php file inside my WordPress theme folder and I customized some fields. My main purpose was to use Bootstrap 4's input groups. When I call the comments using the code piece below, everything is OK:

 <?php
     if (comments_open()) :
         comments_template();
     else :
         echo '<p>You cannot send comments for this post.</p>';
     endif; 
  ?>

But in another section of my website I need the WordPress comment_form() inside a Bootstrap 4 Modal. When I call the comment_form() there, I get the original WordPress Comment From instead of the form that I created (or better to say modified) on my own.

Here's my code:

<div class="modal fade" id="commenting">
    <div class="modal-dialog modal-dialog-centered">
        <div class="modal-content">
            <!-- Modal Header -->
            <div class="modal-header">
                <h4 class="modal-title">Post your comment</h4>
                <button type="button" class="close ml-0" data-dismiss="modal">&times;</button>
            </div>
            <!-- Modal body -->
            <?php 
               comment_form();
            ?>
            <!-- Modal footer -->
            <div class="modal-footer">
                <button type="button" class="btn btn-danger" data-dismiss="modal">Cancel</button>
            </div>
         </div>
    </div>
</div>
1

Yes, You can customize the comment form with the Bootstrap 4.

You just need to do some edits with bootstrap classes and HTML.

$args = array(
    'comment_field' => '<p class="comment-form-comment"><label for="comment">' . _x( 'Comment', 'noun' ) . '</label><textarea id="comment" name="comment" cols="45" rows="8" aria-required="true"></textarea></p>'
  'fields' => apply_filters( 'comment_form_default_fields', array(

    'author' =>
      '<p class="comment-form-author">' .
      '<label for="author">' . __( 'Name', 'domainreference' ) . '</label> ' .
      ( $req ? '<span class="required">*</span>' : '' ) .
      '<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', 'domainreference' ) . '</label> ' .
      ( $req ? '<span class="required">*</span>' : '' ) .
      '<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', 'domainreference' ) . '</label>' .
      '<input id="url" name="url" type="text" value="' . esc_attr( $commenter['comment_author_url'] ) .
      '" size="30" /></p>'
    )

);
comment_form( $args );

Please use this. I think it can help.

1
  • I have done all the steps that you have mentioned, and when I call the comments using comments_template(), my custom comment form shows up perfectly with the comments themselves. My problem is that I just want to use the comment form in a section of my website without displaying the comments and when I call the form using comment_form( );, the default form shows up not my custom made form. Apr 17 '20 at 16:17

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.