The WordPress community has been buzzing in anticipation of the release of WordPress 6.1, throwing around words and acronyms like blocks, site editing, templates, template parts, and more. Much of the excitement centers around the fact that users – who aren’t coders – will be able to create their own designs and page layouts in brand new ways. Now sure, there is a little learning curve ahead, but it’s not very steep. With a bit of guidance and a block theme, anyone can take control of their entire WordPress website design experience.
This guide focuses on block theme templates and template parts, including what they are and how you can use them to customize your website in many unique ways.
Let’s get started.
What are page templates?
The word “templates” can actually refer to several different parts of a WordPress website, and the phrase “page templates” can have various meanings as well. Page builders, for example, will often have a feature that allows users to choose templates for various design activities. For our purposes today, when we use either the word “templates” or the phrase “page templates”, we are specifically referring to the official definition of a template from the WordPress Codex.
Templates are the files that control how your WordPress site will be displayed on the Web. These files draw information from your WordPress MySQL database and generate the HTML code which is sent to the web browser. Through its powerful Theme system, WordPress allows you to define as few or as many Templates as you like all under one Theme. Each of these Template files can be configured for use under specific situations.
As we discuss in more detail in our article, How to Create WordPress Page Templates Using Full Site Editing:
With a page template, you can build a new layout that provides a unique design that you can apply to one page or a group of pages. The only limit to page templates is your imagination. Whether you need a new layout for your Services pages, want to change the look of all your blog posts, or need a custom landing page, a page template can help bring your ideas to life.
Plus, after designing a page template for your website, you can reuse it whenever you want. This can save time when you’re creating new content. Instead of building every page from scratch, you can choose a template to instantly use a layout.
Remember: A page template can be used for any number of pages. It is not the page itself. It is a design and layout that displays a page’s content in a specific way. If a template has been assigned to multiple pages, then editing the template will apply the changes across all the pages that use the template.
What are custom page templates?
Now that we know what a page template is, let’s define the term “custom page template.” This refers to a template that did not come pre-installed with the theme.
A custom page template is one that is created as an additional choice to the default theme templates, to be used in specific situations.
If you install a theme, every page and post will use one of the theme’s default templates. You could leave it that way and have a perfectly beautiful website. However, if you want to have a different design or different layout for certain pages or specific categories, then create a custom page template to fill that need.
And now, let’s look at one last definition.
What are template parts?
A template part is very much what it sounds like; it is a small part of a larger template. More specifically, it usually refers to a structural part of a web page rather than a content-focused part. The most common examples of template parts are headers, footers, and sidebars. These are sections of our pages that are outside our content area but are still part of the entire page. So a typical page template might be composed of a header template part, a content section, one or more sidebar template parts, and a footer template part. Each template part is included in a template via a template part block.
Template parts are helpful because they are reusable. Like reusable blocks, you can add a template part to any template, making it easy to create multiple custom templates that make use of small designed elements that don’t need to be redesigned over and over again.
Because template parts are reusable, they are sometimes confused with reusable blocks. Let’s distinguish between the two.
Template parts should be used only within page templates. Again, it helps to remember that headers, footers, and sidebars, which are all outside of the content area, are typical uses for a template part.
Reusable blocks, on the other hand, are generally used with the content area itself. For additional clarity, reusable blocks can be used within template parts but not the other way around. Template parts should not be used within reusable blocks.
Just remember to match the phrasing. Template parts are used within templates only. They are reusable across different templates but not within your page or post’s content. Reusable blocks can be placed pretty much anywhere – within your content or within your templates and template parts.
12 Examples of Ways that Theme Templates and Template Parts Are Used
So when would you consider using a custom template anyway? Create a custom template whenever the theme’s default template isn’t exactly right for a particular page or group of pages. But what if you just want to tweak the theme’s default templates? You can do that too! Below is a list of examples that help to show the ways a template might be used. We’ll start with the typical default templates you’ll find with most themes and then show why custom templates might could enhance your site’s design.
Templates
1. Single Page
Most themes include a default template for all single pages. You can either edit this default template with the Site Editor or create custom templates to use for specific single pages or groups of single pages.
Example use of a custom template: Contact Page. You may need to embed a full-width interactive map on this page, but the default template is fixed-width. A custom template with a full-width layout would enable you to include the large map on that page.
2. Single Post
Most themes include a default template for all single posts. You can either edit this default template with the Site Editor or create custom templates to use for specific single posts or groups of single posts.
Example use of a custom template: Imagine a default layout that includes the featured image to the left of the post title. You have an important announcement, so you want to place a special extra-large featured image more prominently at the top of the post, with the post title underneath. A custom template can accommodate that.
3. Archives
Most themes include one default template for all archives, which might include the blog home page, category home page, search results archive, author archive, etc. Other themes may have separate templates for each archive type (blog, category, search, etc.). You can edit this default template with the Site Editor or create custom templates for specific archive pages.
4. 404
Some themes include a default template for URLs that end up on a 404 Not found page, but many don’t. You can either edit this default template with the Site Editor or create a custom template to use as your 404 page template.
For example, the Twenty Twenty Two theme provides this 404 template.
You could easily edit this template, change the fonts color and size, or even add new blocks to the page. Maybe you’d like to add some helpful text or links to the most important pages on your site. All of this would be possible and easy to do in the Site Editor.
5. Front Page (static home page)
Some themes include a default template for a static home page, but many don’t. A Front Page template overrides the default homepage settings, and if it exists, it is used instead of any other home page settings you may make. You can either edit this default template with the Site Editor or create a custom template to lay out your front page exactly the way you’d like.
6. Custom Post Type layout (recipes, movie reviews, etc.)
If the theme provides a custom post type, it will usually provide a template to display its archives and pages. If you’ve added your own custom post type or a plugin has created one, there may not be a template for it. You can either edit this default template with the Site Editor or create a custom template to use for your custom post type layout.
7. Special Page Layouts
This is where custom templates shine. Websites generally have a similar layout and style throughout the pages, but occasionally, a page requires its own special flair.
Landing pages are the perfect example.
Landing pages are meant to do one thing and one thing only – convert. And the best way to convert is to give users just one option – the option that converts! To achieve this, most successful landing pages avoid choices by eliminating links to anywhere else other than the one link that will bring the user to where you want them to go. The quickest way to remove this choice overload is to remove the header and footer from the page. Immediately, those links disappear, and visitors won’t be distracted by them.
Take a look at this Freshly landing page for a great example of this. Freshly’s only goal for this page is to have visitors fill out the form. Other than closing the browser tab, there are only two possible choices for a visitor to make. They either fill out the form and click the “See Meals & Pricing” button, or they click the “Get $80 Off” button at the bottom of the page, which takes them – guess where – right up to the top of the page to fill out the form. The two choices are actually only one choice. With no header, no menu, no footer, and simply no other links anywhere on the page, this is a great landing page design.
But without a custom template assigned to it, a page like this will use the default page template, which includes a header and a footer and possibly dozens of distracting links in both of those template parts. So the key to recreating this distraction-free landing page in WordPress is to create a custom page template that doesn’t include the header or footer template parts. Then, when you create the page, you’ll choose the Landing page custom template you created from the Template drop-down instead of the Default template. Let’s quickly see how to do this.
How to Create a New Custom Page Template
First, create a new custom page template and give it a descriptive name.
When editing the new custom template in the Site Editor, delete the header and footer blocks by clicking the 3 vertical dots for more options, then clicking Remove Header or Remove Footer, like this:
Once you’ve saved your new custom template, you can then select it from the Template dropdown selector to assign it to any page, like this:
Other types of pages that often need their own special style are newsletter signup pages and special event pages. Custom page templates will handle these and many other use cases.
8. Taxonomy-specific (by category or tag)
If you’d like different designs or layouts for different categories or other taxonomies (like tags), custom templates are the way to make that happen.
For example, you may prefer to have a different hero image or background color for each post category. A popular blog that uses this method is GetRichSlowly. Notice how each category has a different color.
This is a simple example of just changing the color of a header block, but you could make each category template look very different from the other by rearranging the entire layout if you’d like. And, of course, you could also create custom templates for any other taxonomy, such as a specific tag.
9. Style-oriented
Ever wished you could change the style for a particular page or group of pages? For instance, perhaps you want your portfolio pages to be full-width so your images can really stand out. A custom template makes it easy to select a particular style when needed.
You may want to have a light vs. dark version of a page or group of pages. Two templates, one light and one dark, make it easy to assign each version to any pages you’d like.
Template Parts
10. Header
Most themes include a default template for a site-wide header, but you can edit it or add multiple custom header template parts. These additional headers could be used only within specific custom templates. For example, let’s take a look at the default Twenty Two theme. The theme comes with several different header template parts. This allows you to choose which header style you’d like to include in any particular template. Besides the default header template part, there are two additional ones to choose from – A small, dark header and a large, dark header. These look like this:
A common scenario is to display the large header at the top of an archives template while showing the smaller header on the single page template. How you might choose to use them is up to your imagination and design needs.
11. Footer
Most themes include a default template for a site-wide footer, but you can edit it or add multiple custom footer template parts. Once you create additional footer template parts, you can include them in whichever templates you’d like.
12. Sidebar
Most themes include a default template for a site-wide sidebar, but you can edit it or add multiple custom sidebar template parts. These additional sidebars might be used only within specific custom templates. You may want to create three different templates such as a left sidebar template, a right sidebar template, and a template with no sidebars at all.
Or you may wish to create one sidebar with social icons included in it and another without. How you customize your sidebars is up to you.
Each sidebar template part you create might include different content such as:
- Light vs. dark styles
- With social icons or without social icons
- With or without a particular Call to Action (CTA)
- Any number of blocks might be included in one part but not in another
+ More Uses
What other ways could you use templates and template parts? Perhaps you’d like one template that has a comments section and one without. Or maybe one page template displays a post grid layout while another displays a list of posts. The possibilities probably aren’t endless but they are certainly abundant.
Summary
Now that you know what templates and template parts are, and you’ve seen some various use cases for them, you’re ready to take your own site design up a notch!
If you’re reading this before the official launch of WordPress 6.1, then use this time to learn and make a plan.
- Are you using a Block theme?
- If so, which theme templates would you like to tweak via the Site Editor?
- Do you need any new custom templates?
- What design changes will be needed for those?
If you’re reading this after WordPress 6.1 has launched and your plans and ideas are ready, then head on over to our How to Create WordPress Page Templates Using Full Site Editing guide and let your creativity bust out!
Want more tips? Get new post notifications emailed to you.
ABOUT THE AUTHOR
Go WordPress 