Exploring category templates with block themes


The category template allows you to create a custom page layout for a specific category of posts. In this tutorial, we are going to explore how you can create and customise a category template to display a post category archive.

Learning outcomes

  1. Adding a new category template
  2. Customizing a category template

Comprehension questions

  1. Are you satisfied with how your theme displays posts for a specific category?

Transcript

Hi, and welcome to Learn WordPress. In this tutorial, we are going to explore how to add and customise category templates. When someone visits your blog page, and you have added the Category block to your Query Loop block, each blog post’s category, as in these examples, will be displayed on the front end of your site.

When you click on the category, you will be able to view all the blog posts that have been labelled with this specific category. In this case, Art. As you will see, the category name is at the top, and each post has been labelled with the Art category. But you might not like the way these posts are being displayed. The great thing is block themes give you the ability to add a category template, which allows you to change the design or the look and feel of a page that displays posts by category. Just a reminder, you can add and manage your posts categories below posts.

In the next example, I’ve added and customised the category template. So for the Art category, I’ve created a unique template with its own header and the blog posts displayed side by side in two columns. Let me show you how I did that. To create a unique template for a specific category, make your way to Appearance and click on Editor. This will take you to the Site Editor. Make your way to Templates. At the top right, click on Add New and select Category. As you will see, it says Displays latest posts from a single post category.

When we add this template, it says it will be used only for the specific item chosen and in this case, we will select the Art category for all blog posts about art. The first thing I’m going to do is open up my list view and then remove the header and the archive title. Then I will insert a new header above the Query Loop block, one I’ve already created for the Art category, and you will notice it is below ‘Existing template parts’.

Then I will select the Query Loop block, and in the block toolbar, I will click Replace to replace it with a pattern that comes with my theme. So here, you can scroll through all the various patterns that are available. Once you find the one you’re looking for, merely click on the pattern. Next, I’m going to open the sidebar settings of the Query Loop block and say that I only want to view two columns. Once I’ve done that, I will also push the post title above the post-featured image and add the Categories block below the Post Date block.


Thereafter I will select the Post Featured Image block and change the height of the block to 646 pixels and the width to 86 pixels. Now we can close the sidebar settings and the list view to see what it’s going to look like. Then we can click Save and make our way to the front end of the website. When we click on the Art category, we will see the new design for our category template.

If you would like, you can now go ahead and create a custom template for each of your categories. I trust you can now create custom templates for individual categories. Visit Learn WordPress for more tutorials 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.