Hello
Here I explain how to modify comment section.
it look like this :
And code is here.
functions.php
if ( is_single() && comments_open() && get_option( 'thread_comments' ) ) {
wp_enqueue_script( 'comment-reply' );
}
add_filter( 'comment_form_fields', 'custom_comment_field' );
function custom_comment_field( $fields ) {
// What fields you want to control.
$comment_field = $fields['author'];
$comment_field = $fields['email'];
$comment_field = $fields['comment'];
$comment_field = $fields['cookies'];
// The fields you want to unset (remove).
unset($fields['author']);
unset($fields['email']);
unset($fields['url']);
unset($fields['comment']);
unset($fields['cookies']);
// Display the fields to your own taste.
// The order in which you place them will determine in what order they are displayed.
$fields['author'] = '<div class="row"><div class="col-xl-6"><div class="comment-form__input-box"><input type="text" id="author" name="author" require="required" placeholder="Your Name" ></div></div> ';
$fields['email'] = '<div class="col-xl-6"><div class="comment-form__input-box"><input type="text" id="email" name="email" require="required" placeholder="Your Email"></div></div></div>';
$fields['comment'] = '<div class="row">
<div class="col-xl-12"><div class="comment-form__input-box text-message-box"><textarea id="comment" name="comment" required="required" placeholder="Your Comment"></textarea></div></div></div>';
$fields['cookies'] = '<p class="comment-form-cookies-consent"><input id="wp-comment-cookies-consent" name="wp-comment-cookies-consent" type="checkbox" value="yes"><label for="wp-comment-cookies-consent"> Save details for future comments?</label></p>';
return $fields;
}
wp_enqueue_script( 'comment-reply' );
}
add_filter( 'comment_form_fields', 'custom_comment_field' );
function custom_comment_field( $fields ) {
// What fields you want to control.
$comment_field = $fields['author'];
$comment_field = $fields['email'];
$comment_field = $fields['comment'];
$comment_field = $fields['cookies'];
// The fields you want to unset (remove).
unset($fields['author']);
unset($fields['email']);
unset($fields['url']);
unset($fields['comment']);
unset($fields['cookies']);
// Display the fields to your own taste.
// The order in which you place them will determine in what order they are displayed.
$fields['author'] = '<div class="row"><div class="col-xl-6"><div class="comment-form__input-box"><input type="text" id="author" name="author" require="required" placeholder="Your Name" ></div></div> ';
$fields['email'] = '<div class="col-xl-6"><div class="comment-form__input-box"><input type="text" id="email" name="email" require="required" placeholder="Your Email"></div></div></div>';
$fields['comment'] = '<div class="row">
<div class="col-xl-12"><div class="comment-form__input-box text-message-box"><textarea id="comment" name="comment" required="required" placeholder="Your Comment"></textarea></div></div></div>';
$fields['cookies'] = '<p class="comment-form-cookies-consent"><input id="wp-comment-cookies-consent" name="wp-comment-cookies-consent" type="checkbox" value="yes"><label for="wp-comment-cookies-consent"> Save details for future comments?</label></p>';
return $fields;
}
comments.php:
<div class="comment-one">
<?php if ( have_comments() ) : ?>
<h2 class="comments-title"></h2>
<div class="main_comment">
<?php
//$comments_number = get_comments_number();
// Get all comments for the post
$comments = get_comments(array(
'post_id' => $post->ID,
'status' => 'approve', // Only get approved comments
'parent' => 0, // Only get top-level comments (i.e. not replies to other comments)
'order' => 'ASC' // Order comments by oldest to newest
));
foreach($comments as $comment) {
//echo "<pre>";print_r($comment);
$comment_author = $comment->comment_author;
$comment_content = $comment->comment_content;
$author_img = get_template_directory_uri().'/assets/comment-1-1.jpg';
$comment_ID = $comment->comment_ID;
$replylink = get_permalink(get_the_ID()).'?replytocom='.$comment_ID.'#respond';
echo '<div class="comment-one__single">
<div class="comment-one__image">
<img src="'.$author_img.'" alt="">
</div>
<div class="comment-one__content">
<h3>'.$comment_author.'</h3>
<p>'.$comment_content.'</p>
<a href="'.$replylink.'" class="thm-btn comment-one__btn" data-commentid="" data-postid="">Reply</a>
</div>
</div>';
// Get the replies for the comment
$replies = get_comments(array(
'post_id' => $post->ID,
'status' => 'approve', // Only get approved comments
'parent' => $comment->comment_ID, // Only get comments that are replies to this comment
'order' => 'ASC' // Order replies by oldest to newest
));
foreach ($replies as $reply) {
$reply_ID = $reply->comment_ID;
$replylink1 = get_permalink(get_the_ID()).'?replytocom='.$reply_ID.'#respond';
echo '<div class="comment-one__single sub_reply_class">
<div class="comment-one__image">
<img src="'.$author_img.'" alt="">
</div>
<div class="comment-one__content">
<h3>'.$reply->comment_author.'</h3>
<p>'.$reply->comment_content.'</p>
<a href="'.$replylink1.'" class="thm-btn comment-one__btn">Reply</a>
</div>
</div>';
}
}
?>
</div>
<?php //the_comments_navigation(); ?>
<?php endif; // Check for have_comments(). ?>
<?php
comment_form(
array(
'logged_in_as' => null,
'title_reply' => esc_html__( 'Leave a comment', 'immigration' ),
'title_reply_before' => '<h2 id="reply-title" class="comment-reply-title chi">',
'title_reply_after' => '</h2>',
)
);
?>
</div><!-- .comments-area -->
