Adding comments to your WordPress site’s theme involves integrating the necessary code to enable and display comments on your posts and pages. Here’s a step-by-step guide on how to add comments to your WordPress theme:
Note: Before making any changes to your theme, it’s essential to back up your site and use a child theme if you plan to modify your theme’s files. This helps you avoid losing customizations when the theme receives updates.
Step 1: Create a custom comments.php
File
Creating a custom comments.php
file in WordPress allows you to control the appearance and layout of the comments section on your website. Below is an example of a basic comments.php
file that you can use as a starting point for your WordPress theme. This example uses standard HTML and WordPress template tags to display comments in a traditional format.
<?php
if (post_password_required()) {
return;
}
if (have_comments()) : ?>
<section id="comments" class="comments">
<h2 class="comments-title">
<?php
$comments_number = get_comments_number();
if ($comments_number === 1) {
echo esc_html__('One Comment', 'your-theme-text-domain');
} else {
echo esc_html($comments_number) . ' ' . esc_html__('Comments', 'your-theme-text-domain');
} ?>
</h2>
<ol class="comment-list">
<?php
wp_list_comments( array( 'style' => 'ol', 'short_ping' => true, 'avatar_size' => 45, ) );
?>
</ol>
<?php
if (!comments_open() && get_comments_number()) :
?>
<p class="no-comments">
<?php
esc_html_e('Comments are closed.', 'your-theme-text-domain');
?>
</p>
<?php
endif;
?>
</section>
<?php
endif;
comment_form();
?>
This code includes the following elements:
- The
post_password_required()
check ensures that comments are only displayed when the post is not password-protected. - It checks if there are comments and, if so, displays the comments title.
- The
wp_list_comments()
function generates the comments list with options for styling and avatar size. Customize these options as needed. - If comments are closed, a message is displayed to inform users.
- Finally, it calls the
comment_form()
function to render the comment submission form.
You should customize this code to match the design and styling of your WordPress theme. You can add additional HTML, CSS, and template tags to modify the comments section’s appearance and behavior according to your specific requirements.
Step 2: Enable Comments in WordPress Settings
- Log in to your WordPress dashboard.
- In the left sidebar, click on “Settings” and then choose “Discussion.”
- Under “Default article settings,” ensure that the “Allow people to post comments on new articles” option is checked.
- Configure other discussion settings as per your preferences, such as comment moderation and notification options.
- Click the “Save Changes” button to save your settings.
Step 3: Add Comment Template Tags to Your Theme Files
To display comments on your posts and pages, you need to add the relevant code to your theme files. The primary files to edit are single.php
(for single posts) and page.php
(for static pages). Here’s how to do it:
- In your WordPress dashboard, navigate to “Appearance” and choose “Theme Editor.“
- Select the theme you are currently using.
- In the list of theme files on the right, find and click on
single.php
to edit it. If your theme doesn’t have asingle.php
file, look forcontent-single.php
or a similar file. - Find the location in the file where you want to display comments, usually just below the post content. Add the following code where you want the comments to appear:
<?php if (comments_open() || get_comments_number()) { comments_template(); } ?>
This code checks if comments are open for the post and if there are any comments to display. If both conditions are met, it loads the comments template. - Click the “Update File” button to save your changes.
- Repeat the same process for the
page.php
file to enable comments on static pages.
Step 4: Configure Comment Settings for Individual Posts or Pages
WordPress allows you to customize comment settings for individual posts and pages. Here’s how:
- When creating or editing a post or page, scroll down to the “Discussion” meta box.
- Check the “Allow comments” option to enable comments for that specific post or page.
- You can also set individual comment settings like allowing or disabling comments and trackbacks on this screen.
- Click “Update” or “Publish” to save your changes.
Step 5: Style Your Comments Section
By default, WordPress will style your comments section based on your theme’s CSS. However, you can further style the comments section by adding custom CSS to your theme. You can do this in the WordPress Customizer (Appearance > Customize) under the “Additional CSS” section.
For example, you can change the font, color, background, and spacing of the comment section to match your site’s design.
That’s it! Your WordPress theme should now have comments enabled, and users can leave comments on your posts and pages. Remember to engage with your audience by responding to comments, as this can foster a sense of community on your site.
Found this article interesting? Follow Brightwhiz on Facebook, Twitter, and YouTube to read and watch more content we post.