Creating a WordPress theme Part 5 – Comments

This series is about how to create and develop a WordPress blog theme in 2021 using the correct methods and techniques.

Part 5 building the comments section. Part 4 was the single post page. Part 3 included settings values, The WordPress loop and pagination. Part 2 was splitting the theme into different sections as well as theme naming and details. Part 1 was the installing and setup of WordPress and base theme.

For this guide you will need a local webserver with PHP and MySQL, I will be using XAMPP and HeidiSQL for this series.

Comments section

Time to create and add in the comment section at the bottom of the posts page. This means single.php needs to be edited.

Change this part

<?php
if (have_posts()) : while (have_posts()) : the_post();
    get_template_part('content-single', get_post_format());
endwhile; endif;
?>

to

<?php
if (have_posts()) : while (have_posts()) : the_post();
    get_template_part('content-single', get_post_format());

    if (comments_open() || get_comments_number()) :
        comments_template();
    endif;

endwhile; endif;
?>

If comments are open or there are comments for the post then include comments.php which gets called from the comments_template(); hook.

The comments process would be at this stage most complicated file so far from this series. Essentially it is a conditional for if there are comments vs if no comments but they are allowed.

I commented the file to better help its readability

comments.php

<?php if (post_password_required()) {
    return;//Password required OR incorrect password applied
} ?>
<div id="comments" class="comments-div">
    <?php if (have_comments()) : //Has comments?>
        <h4 class="comments-amount">
            <?php
            printf(_nx('One comment for "%2$s"', '%1$s comments for "%2$s"', get_comments_number(), 'comments title'),
                number_format_i18n(get_comments_number()), get_the_title());
            //Prints comments amount text: "8 comments for POSTNAME" or "1 comment for POSTNAME"
            ?>
        </h4>
        <ul class="comment-list">
            <?php
            wp_list_comments(array(
                'max_depth' => 3,//Max comment reply depth of 3
                'per_page' => 20,//20 comment per page
                'avatar_size' => 64,//Avatar size of 64 x 64
            ));
            //Returns the comments
            ?>
        </ul>
    <?php endif; ?>
    <?php if (!comments_open() && get_comments_number() && post_type_supports(get_post_type(), 'comments')) : ?>
        <p class="comments-empty">
            <?php _e('Comments not allowed');
            //If comments closed and 0 comments and (but) post does support comments then:
            //print "Comments not allowed"
            ?>
        </p>
    <?php endif; ?>
    <?php comment_form();
    //The add comment form
    ?>
</div>

wp_list_comments() has all the settings for the comments such as depth and comments per page.

It can also set the comment listing method (ul, ol or div), this is set with style and the default is ul.