The Difference Between Reusable Blocks, Block Patterns, Templates & Template Parts

This workshop will walk you through the key differences between reusable blocks, block patterns, templates and template parts. We will also shed light on when and why you need to use them.

Learning outcomes

1. Explaining the difference between reusable blocks, block patterns, templates and template parts.
2. Identifying which block type is used for which purpose.
3. Converting a regular block to a reusable block and inserting it into a different page.
4. Adding a block pattern to a page or post.
5. Accessing and describing the role of templates and template parts.

Comprehension questions

1. What are the advantages of using reusable block or block patterns?
2. How do you access and manage templates and template parts?

Transcript

Good day and welcome to Learn WordPress. This lesson will walk you through the key differences between reusable blocks, block patterns, templates and template parts. We will also shed light on when and why you need to use them. So let’s jump straight into it.

Let’s start with reusable blocks. Well, the reusable block is a content block that you create, save, and reuse later as you need, and it allows you to save a block or a group of blocks. You can even export reusable blocks and import them to another website. So I think you will agree with me; reusable blocks will save you a tonne of time and effort. You can use reusable blocks for example, for things like social icons, a call to action, a thank you note, feedback forms, tables and promotional banners. For this example, I have created a restaurant website and an Hours and Location block, which I would like to save as a reusable block and use elsewhere on my site.

I will use the List View to ensure that I select the entire block. And once the block is selected, I will click on the three vertical dots in my List View and select Add to reusable blocks. And once selected, I will name it appropriately, and in this case, I will call it Hours and Location and then click Save. Now I will make my way to my About page and then scroll down to the bottom to add the reusable block there, and once you’re ready, click on the Inserter top left, and then next to blocks and patterns, click on Reusable and then select the relevant reusable block.

You will notice once you convert a block to a reusable block, it seems more narrow, but don’t stress, it will still appear as normal on the front end of your website. If you edit your reusable block, the changes will apply everywhere the block is used. So let’s say you don’t want it to be reusable anymore. Well, click on the three vertical dots and select Convert to regular blocks. Any changes now will only apply here. One last thing, If you have multiple reusable blocks you can select Manage reusable blocks, and as the name implies, here you can manage all your reusable blocks. Let’s move on and talk about block patterns.

Block patterns are predefined groups of blocks or pre-made designs. In one click, you can have access to beautiful and functional layouts from testimonials, headers, galleries and more. It is also important to note; changes made to a block pattern do not affect the pattern or any other content that uses the particular block pattern. To add a block pattern, click on the Inserter top left and select Patterns next to Blocks. Here you are able to choose from a wide variety of patterns: footer patterns, header patterns, column patterns, etc. I’m going to insert a columns pattern and a text pattern to show you how quickly you can create structure on your page.

Firstly, I will add the columns pattern and once selected, you will be able to modify the block to meet your requirements. I am organising a conference with various speakers so let’s change the heading to Conference, and of course, you can change the image, the buttons, the paragraph, etc.

Next, I’m going to insert a text pattern so let’s make our way back to Patterns, click on Text and I will select the pattern labelled List of events. And now you can edit the detail in just a few steps. Let’s change the name of one of the speakers for example and just for interest sake, you even have the option to save a pattern as a reusable block.

Lastly, let’s briefly talk about templates and template parts. Templates are broken down between templates that describe a full page and template parts that describe reusable areas within a template. Templates can be described as a full-page layout that includes template parts like headers, footers, and sidebars. Let’s make our way to Appearance and click on the Editor. This will take us into the Site Editor where you are able to manage your templates and template parts. I’m currently on my homepage template. Click on the WordPress icon or site icon top left to view all the available templates and template parts. If I return to my homepage template, you will notice the header and the footer template parts that have been created to add site structure to our template.

If you would like to create templates that a page or post uses, you have to make your way back to the Dashboard and open a Page or a Post. I will be opening my About page and in the sidebar settings you can assign a different template to a page or post or you could edit the template assigned to the post, or you could create a new custom template. I have already created a custom template for a landing page so let’s open up the page Sign up for our newsletter and then I will select Edit to edit the template that this page is assigned to. And as you will notice, I have created a custom template for my landing page with a unique header and footer.

I trust you will now be able to differentiate better between reusable blocks, block patterns, templates and template parts. Visit Learn WordPress for more workshops and training material.