Templates

Welcome to this lesson on templates for WordPress themes.

Theme templates and how WordPress handles the final markup

Templates are files that represent the overall document structure of the front end. For a modern block theme, they are made up of block markup and render both static and dynamic data.

Let’s take a look at the template for a page. We’ll open the pages template in the site editor and we’ll open up the code editor to take a look at the block markup code.

Block markup is identified by a specific HTML comments notation. It tells the page being rendered to render the output for that block. Additional information about the block, like attributes or inline styles, is passed to the block markup in a JSON format. WordPress parses this block markup and translates it into its final HTML markup within a web browser.

How the templating system works

When someone visits WordPress sites single post, the template used follows a set of rules outlined by the template hierarchy. Now this is a chart and it’s available on WordPress.org and note that the decision-making process moves from left to right within this chart.

For instance, if we think about our example, a site visitor navigates to a single post and the active WordPress theme doesn’t include either the single.html or the singular.html templates, then it would default to using the index.html template. Let’s take a look now at the typical templates found within a theme.

These are the templates included within the Twenty Twenty-Four theme.

Common templates found within a theme

Index: this is the fallback template file and it is a required file in all themes.

Single: used when a visitor requests a single post as we saw in our example.

Page: used when visitors request individual pages.

Archive: used when visitors request posts by archive type, for example, category or author.

Search: used for search results when a visitor does a search on a website

404: used when WordPress cannot find a post page or other content that matches the visitors request.

Difference between templates and template parts

We have a parts folder within our themes folder and it contains the template parts files. Template parts are meant to provide areas of web pages that are repeated and inherently remove the need to create them more than once.

A good example of this is a header or a footer and in addition they provide a consistent look and feel throughout the site. Templates can include either one or more template parts, however you can opt to not have any at all.

This concludes our brief overview of WordPress templates. Note that you’ll learn much more about creating templates and template parts in in the Intermediate Theme Developer Learning Pathway.