Displaying the Post Comments block in Block Themes


In this workshop, we are going to take a closer look at how post comments are displayed when you are using a block theme.

Learning outcomes

  1. Managing the Post Comments block via the Site Editor and Template Editor.
  2. Using the List View to gain a clear picture of the structure of the Single Post template.
  3. Identifying the implications of removing the Post comments block.
  4. Creating a custom template and adding a Post Comments block.

Comprehension questions

  1. What is the function of the Post Comments block?
  2. What happens if you remove the Post Comments block from the Single Post template?
  3. How does using a classic theme and block theme differ?

Resources

Intro to the Site Editor and Template Editor

Templates

Transcript

Hi, and welcome to Learn WordPress. Today we are going to take a closer look at how post comments are displayed when you’re using a block theme. But before we make our way to the backend of our website, let’s see how comments display when people respond to a blog post.

So when I visit the front end of my website, I will scroll down to one of my blog posts called Go Local. When we go to the bottom of the post, we will notice three people have already responded by adding their comments: Roger, Tina and Ross, and below that there is a section for more people to have their say.

Allowing comments on your site has many advantages. It allows you to deepen your relationships with readers and find out what readers are interested in. It also increases the likelihood of them subscribing to your newsletter or purchasing something in future. Essentially, allowing comments can help you to build a community around your blog. It is of course important to manage comments effectively by using the built-in settings of WordPress under Discussions in your dashboard and installing an anti-spam plugin.

But for now, let’s make our way back to the dashboard to investigate the Post Comments block. But to do that, we need to access templates. There are two ways to access templates, via the Site Editor and the Template Editor. Let’s first make our way to the Site Editor. Go to Appearance and click on Editor. This opens up the Site Editor where you are able to manage your templates, template parts and also where you can customise the global styles or site-wide styles of your website. We are after the Single Post template today.

The Single Post template displays the page structure for single posts. When we open up the List View we will have a clear picture of the current layout of single posts. And right at the bottom, you’ve got your post comments below. Just a reminder, you have the choice to modify the layout of single posts according to your requirements.

But have you wondered what will happen if you delete the Post Comments block, well all comments on all blog posts that have been assigned to this template will disappear on the front end of your website. If we make our way back to the front end of my website, we will notice that this post has been assigned to the Post template and the three comments below display because of the Post Comments block. Let’s go back to the template, click on the three vertical dots and remove the Post Comments block. Click Save, and then let’s return to the front end of my website. I’m going to reload the page and when we scroll down, we will notice that the comments are gone. I actually want my comments to display so I’m going to go back to my template, click on Undo, click Save, and then we will notice after reloading the page, the comments are back. So tread carefully as some might accidentally remove the Post Comments block without realising the impact it will have.

The second way we access templates is via the Template Editor. We are going to make our way back to the dashboard, click on Posts and open one of our existing posts. And in the sidebar settings, we’ll see that the default template is being used which is the Single Post template. And when you click edit, it will take you into the Template Editing Mode. You will be able to customise how single posts are displayed just as when you were in the Site Editor.

If we open the List View again, we will see that the Post Comments block is part of a Group and is located below the Separator block. The one difference you will notice when you are in Template Editing Mode is that the content of your page and post comments are visible. Please remember though, templates are used to create site structure and are not used to add or edit content. But when you go back to your post and click on Default Template you will notice that you can assign this post to a different template. Or if you click on New, you can create your own custom template.

Give your new template a descriptive name and click Create. Open the List View and remove the header. Click on Insert Before and then add your new header. I’m going to choose an existing header that I’ve already created then scroll down, click on the Inserter and add a footer. You can choose an existing one but I’m going to create a new footer. I will use the Carousel View to select one of the available patterns, and once you’re happy, click Choose. Name it appropriately and click Create, and lastly, don’t forget to add your Post Comments block, otherwise no comments will display.

Let’s go to the front end of our website to see our changes in action. Firstly, I’m going to open up a different post The World is Your Oyster and you will notice that this post has still been assigned to the single post template. And if I go back and open up the Go Local post, you will notice that this post has been assigned to the custom template which I’ve just created.

So if you have installed a block theme, be on the lookout for the Post Comments block. Explore Learn WordPress for more workshops and training material.

Workshop Details


Presenters

Wes Theron
@west7

I am an Instructional Designer for the WordPress open-source project sponsored by Automattic. I am a strong supporter of the open-source movement. I have a background in education and content development. I am a husband, father, dreamer and lifelong learner.