Home / Blog / Developer Guide to WordPress Block Theme / Creating and Editing WordPress Block theme Templates and Template Parts

Creating and Editing WordPress Block theme Templates and Template Parts

In the world of website design and development, WordPress block themes have brought about a revolution. These themes have completely transformed the traditional approach by offering a great way to create websites. With block themes, the process of constructing a website layout revolves around customizable blocks, providing an extreme level of flexibility. Among the essential components that contribute to building a robust block theme, templates and template parts take center stage.

Templates and template parts are the driving force behind the power and effectiveness of a block theme. They play a crucial role in shaping the structure, layout, and behavior of blocks, allowing developers to unleash their creativity and design unique and visually captivating websites. So understanding and utilizing templates and template parts are key aspects of building a powerful block theme.

That’s the reason, in this article, we will delve into the world of WordPress block theme development by editing and creating templates and template parts.

Templates in WordPress Block Theme:

In WordPress, a theme can consist of various types of templates. And those templates control the appearance and functionality of different elements on a website. These templates serve different purposes and can be edited using different editors within WordPress.

In the context of a WordPress block theme, templates are responsible for defining the overall structure and layout of a block or a group of blocks. They are typically created using a combination of HTML, CSS, and PHP code. Templates provide a way to customize the visual appearance and functionality of blocks by specifying how the block’s content should be displayed on the front end.

A template can be associated with a specific block type or block pattern, and it controls the markup and styling of that block or pattern. By modifying the template, you can customize the design and layout of individual blocks within your block theme.

Editing Templates:

WordPress block themes have introduced a new way to edit and customize templates directly within the WordPress dashboard. Unlike traditional themes where editing template files was done outside the dashboard, block themes allow you to modify templates using the block editor itself, providing a more intuitive and user-friendly experience.

In the past, editing template files directly was discouraged due to the risk of coding errors or changes being overwritten during theme updates. However, block themes have addressed these concerns by eliminating the need for direct file modifications.

To edit templates in a block theme, log in to your WordPress dashboard and navigate to the “Appearance” section. Click on the “Editor” option.

Once you are in the site editor, click on the WordPress logo located in the upper left corner. On the next screen, you’ll see multiple items including “Templates”.

Now, click on the “Templates” option. Here, you will see a list of available templates for your theme. In Twenty Twenty-Two, there are several templates you can edit including single post, page, 404, blank, search archive, and more.

To manage those templates, scroll down and click on “Manage all templates”. Now, you can select a specific template, such as the single post, page, 404, or others, to customize its design.

Next, click on a template and it will open it in the Block Editor. If you click on one of them (e.g., 404), you’ll be able to view the page:

Within the Block Editor, you can customize the blocks within the template. You can modify existing blocks, add new blocks, and adjust their settings using the options available in the editor’s sidebar. After making the desired modifications, click the Save button to save your customizations.

However, clicking on the ellipsis (︙) icon on the right lets you clear your customizations.

Creating Templates:

Additionally, you have the option to create entirely new templates for your site by clicking the “Add New” button in the top right corner of the dashboard.

Once you click on “Add New”, you will find various options such as front page, author, category, date, tag, and taxonomy pages. However, these options will differ depending on the block theme you are using.

With the ability to edit and create templates directly within the WordPress dashboard using the block editor, customizing your block theme becomes a more accessible and streamlined process. It allows you to design and modify your website templates with greater ease and flexibility, empowering you to create unique and personalized experiences for your visitors.

Template Parts in WordPress Block Theme:

In WordPress block themes, you can reuse template parts, which are modular sections of code, across different templates within the theme. They provide a way to break down the overall template structure into smaller, manageable components, making it easier to maintain and customize specific sections of the theme. They are created as separate files that contain specific sections of markup or functionality. For example, you could have a template part for the header section, another one for the footer, and additional parts for different sections of a block.

By including template parts within your templates, you can easily maintain consistency and make updates across multiple blocks or block patterns. Template parts enhance the reusability and maintainability of your block theme by separating different sections of code into manageable pieces.

Template parts provide flexibility and efficiency in WordPress block themes. They allow developers to modularize their code, simplify maintenance, and promote consistency throughout the theme. By leveraging template parts, you can create highly customizable and organized block themes that are easier to manage and customize.

Editing Template Parts:

Apart from templates, we have the option to edit WordPress block theme by modifying its template parts. But the available template parts and their specific options may vary depending on the block theme you have selected. Each theme may provide different template parts to customize, giving you the flexibility to tailor your website to your unique requirements. For this tutorial, we’re continuing with the Twenty-Twenty-Two theme.

To edit the template parts of your block theme, access the WordPress dashboard and go to the Appearance section. Click on the Site Editor option.

In the Site Editor, click on the WordPress logo located in the top right corner. This will open a column on the left side of the screen, click on “Template Parts” from the column.

At this point, select “Manage all template parts” to open the Template Parts page. Here, you can find a list of the template parts that your theme has.

Next, select the specific template part that you want to customize. For example, you can click on “Header” to modify the header section of your theme. Once you’ve chosen a template part, you will have the ability to customize its individual sections. Depending on the part you’re editing (e.g., header), you can make changes to the site title, adjust the menu, and more. The Site Editor provides an intuitive interface to modify these elements.

When you have completed making changes to the template part, click on the blue “Save” button. This will save your changes.

Creating Template Parts:

WordPress Full Site Editing option also allows you to create new Template Parts, expanding your customization options even further. To create a new Template Part, go back to the Template Parts section. Template Parts.

Once you are in the Template Parts menu, click on the “Add New” button located in the top right corner.

Now, a pop-up window will appear with three types of Template Parts you can create General, Header, and Footer.

• General: This is a versatile Template Part that is not specifically tied to any particular area of your website. You can use it to build predefined blocks to be used on different pages of your WordPress site.
• Header: This type of Template Part represents the top area of your website pages and often contains navigation menus or a title. You can create different variations of the header for different pages of your site.
• Footer: This type of Template Part represents the bottom area of your website pages, typically featuring consistent information and links across different pages. However, you might need to create variations of the footer based on your specific website needs.

You can choose any of the given options such as: header. Now, provide a name for your Template Part, then click on the blue “Create” button.

Next, you will be presented with a blank screen, with the name of your Template Part displayed at the center and top of the screen. To start building your Template Part, click on the “+” sign in the top left corner. You can then select blocks or patterns to construct your desired layout within the Template Part.

Once you have finished creating Template Part, click on the “Save” button in the top right corner.

This completes the creation of your template part. If you navigate back to the list of template parts, you will now see your newly created template part added to the list.

Cleare Customization:

In WordPress, you not only have the ability to make changes to template parts but also the option to clear those changes and return the template parts to their original state.

To clear customized default template parts, go back to the “Template Parts” page. Now, locate the template part you want to clear the customizations for. To the right of the template part, click on the 3-dot vertical menu. From the options that appear, choose “Clear customizations”.

On the other hand, if you want to delete an added template part entirely, locate the template part you want to delete. Click on the 3-dot vertical menu to the right of the template part. From the options that appear, select “Delete template”.

By choosing this option, you will permanently remove the selected template part from your WordPress block theme.

Conclusion:

In the past, making changes to templates within WordPress often demanded a significant level of proficiency in PHP programming. However, with recent advancements, the process of customizing layouts to align with your specific requirements has become much more accessible.

If you are utilizing block themes such as Twenty Twenty Two, you can navigate to the templates and template parts section. These areas allow you to delve into the inner workings of your theme’s templates and make personalized adjustments to the layouts with relative ease.

By exploring the templates and template parts area, you gain the ability to fine-tune the appearance and structure of your website precisely as you desire. Whether it involves rearranging content blocks, modifying the styling, or introducing new elements, this comprehensive customization capability empowers you to achieve a visually appealing and functional website that caters specifically to your needs.

That’s it for today. Hope this article helped you to get a clear picture of creating and editing WordPress block theme templates and template parts. For more WordPress-related tutorials, visit our Blog page.

Lastly, don’t forget to follow our Facebook page and subscribe to our YouTube channel.