A Simple Information to the WordPress Template Hierarchy

Should you’re constructing your personal themes for WordPress, or utilizing a toddler theme to customise a 3rd occasion theme, in some unspecified time in the future you’ll come throughout the template hierarchy.

It’s an excellent system that dictates how WordPress chooses which template file to make use of for several types of content material. It takes into consideration content material sorts (e.g. posts, pages, attachment and customized put up sorts), taxonomies (e.g. in class, tag and customized taxonomy archives) and even enables you to create bespoke templates for particular pages.

However it may be complicated. When confronted with an archive for a taxonomy that applies to a put up kind, for instance, which template do you have to use? And the way do templates for single posts work?

On this put up I’ll stroll you thru the template hierarchy and clarify the way it works with some labored examples. By the point you’ve learn by this it is best to have the ability to create theme template information like a professional!

Notice: my favourite useful resource on the template hierarchy is wphierarchy, which has a transparent interactive diagram.

Proceed studying, or leap forward utilizing these hyperlinks:

The WordPress Template Hierarchy: Varieties of Templates
How WordPress Chooses a Template File
A Labored Instance
Embody Recordsdata
Template Recordsdata and Baby Themes

The WordPress Template Hierarchy: Varieties of Templates

The template hierarchy dictates how WordPress offers with 5 important web page sorts:

There are three template information which are extra basic. The fallback template file is index.php. That is used if WordPress can’t discover the rest for the precise content material kind. It ought to, due to this fact, work appropriately for archive pages, single posts and single pages (in addition to all different content material sorts). A theme has to have an index.php file to work; it may, in idea, have simply this file and the stylesheet. The opposite basic template information are 404.php for errors and search.php for search outcomes.
Templates for particular archive shows, like class and taxonomy archives, allow you to show totally different content material for various listings. For instance you may use various archive template information if one put up kind has customized fields you need to show, if you wish to alter the loop or if you wish to add additional content material or widget areas.
Web page templates show you how to show totally different content material on totally different static pages (for instance if you wish to show a sidebar on some pages however not all). You’ll be able to then select which template a given web page makes use of through the admin screens.
Single put up templates, together with customized put up kind templates, allow you to show totally different content material for various put up sorts, for instance if you wish to use the loop otherwise (e.g. displaying totally different metadata).
Contains, reminiscent of header.php, sidebar.php and footer.php, might be created for various areas for the positioning rather than or in addition to a template file, to show totally different widgets or content material in these areas of the positioning. They don’t simply need to be for headers, footers, and sidebars although – you should use an embrace wherever you need to save writing the identical piece of code into each template file. A typical instance is the WordPress Loop.

How WordPress Chooses a Template File

When WordPress opens a web page in your website it checks what content material kind is being displayed after which chooses the proper template file accordingly.

For static pages:

singular.php overrides index.php, after which web page.php overrides each.
page-$slug.php or page-$ID.php override web page.php when a web page with the proper slug or ID is being displayed
front-page.php beats index.php and web page.php when the house web page is seen.
A customized template web page, reminiscent of page-without-sidebar.php, when chosen by the web page’s admin panel, beats web page.php, house.php, page-$slug.php and page-$ID.php.

For particular person posts and attachments:

singlular.php overrides index.php, and single.php beats each.
single-post.php overrides single.php when a single put up is being seen (as in opposition to an attachment or a customized put up kind).
single-$posttype.php beats single.php when displaying a single put up of a given put up kind.
single-$posttype-$slug.php beats single-$posttype.php for a put up with the given slug.
attachment.php overrides single.php when an attachment is seen.
A customized MIME kind web page ($mimetype.php) beats attachment.php when attachments of a given MIME kind are seen. For instance, you may use picture.php, video.php, or any accepted MIME kind.

For archives:

house.php beats index.php for the house web page or the primary weblog. If the house web page is the primary weblog web page, then front-page.php beats each of those.
archive.php beats index.php when a class, tag, date, or writer itemizing is seen.
class.php overrides archive.php when a particular class itemizing is seen. A category-$slug.php or category-$ID.php template override class.php when displaying posts from the related class ID or slug.
tag.php overrides archive.php when a tag itemizing is seen. A tag-$slug.php or tag-$ID.php file override tag.php.
writer.php overrides archive.php when the listing of posts by an writer is seen, which in flip is trumped by author-$ID.php and author-$nicename.php.
archive-$posttype.php beats archive.php when listings for a given put up kind are being seen.
date.php overrides archive.php when a listing of posts for a given date is seen.
taxonomy.php overrides archive.php when viewing a taxonomy archive. For a particular taxonomy, taxonomy-$taxonomy.php will even beat that (the place $taxonomy is the taxonomy slug), and for a time period within the taxonomy, taxonomy-$taxonoomy-$time period.php will beat all of those.

As well as:

search.php trumps index.php when the outcomes from a search are seen. You may anticipate a search to make use of an archive template but it surely doesn’t: it both makes use of index.php or search.php if that exists.
404.php beats every part else when a URL is displayed for which WordPress can discover no content material. You should use this to show some customized content material for 404 pages, reminiscent of an error message and search field.
index.php is crucial for the theme to work as WordPress will fall again to it when displaying content material not accounted for by any of the opposite templates you’ve arrange.

A Labored Instance

Let’s think about my website has a variety of single pages, a entrance web page with static content material, loads of archives, a put up kind of product and a taxonomy of productcat.

My theme has these template information:

index.php
front-page.php
web page.php
mypagetemplate.php
single.php
archive.php
class.php
taxonomy.php
taxonomy-productcat-featured.php
404.php
search.php

Which file do you suppose WordPress would use for these pages in my website?

The house web page (a static web page)
A static web page
A single put up
A product
A product with the featured time period within the productcat taxonomy
An error web page
A search web page
A class archive
A tag archive.

See for those who can work out from my information above which template file my website would use for every of these pages. No checking under!!

Listed here are the solutions:

The house web page: front-page.php
A static web page: web page.php (or mypagetemplate.php if I choose that within the web page admin display screen)
A single put up: single.php
A product: single.php
A product with the featured time period within the productcat taxonomy: taxonomy-productcat-featured.php
An error web page: 404.php
A search web page: search.php
A class archive: class.php
A tag archive: archive.php

Did you get all of them proper? If not, take a while to work by every and familiarise your self with how WordPress would work by the template hierarchy.

Embody Recordsdata

In addition to the template information, WordPress makes use of a variety of contains, that are used for content material which can be inserted right into a template. The most typical contains are header.php, sidebar.php and footer.php, all of which might have a number of variations reminiscent of header-home.php, sidebar-$posttype.php or no matter’s wanted to your website.

To name the generic header in your template file, use get_header():

If you wish to create a particular header embrace file for one of many content material sorts in your theme (e.g. the house web page), you may create a file referred to as header-home.php after which name it like this:

This may name the header-home.php file and output its contents the place you place it within the template file (which ought to be on the prime). You’ll both use this rather than the usual embrace within the related template file (on this case house.php), or you may use it in a conditional operate, as under:

You should use this to name certainly one of a number of contains relying on what a part of the positioning the consumer is in.

In addition to the header, sidebar and footer contains, WordPress makes use of another commonplace contains:

get_search_form() fetches the searchform.php file out of your theme – if one doesn’t exist, WordPress will generate the search kind
comments_template() fetches the feedback.php file out of your theme – if there isn’t one, it’s going to embrace wp-includes/theme-compat/feedback.php from WordPress core.
get_template_part() fetches customized contains such because the loop for instance. This helps you make your themes extra environment friendly by solely coding as soon as. So when you have one loop.php file and name it in all of your template information, then you definately solely need to edit the code as soon as if you wish to change your loop.

To make use of get_template_part() to name the loop.php file, you’d use this:

Template Recordsdata and Baby Themes

However what for those who’re utilizing a toddler theme to change a guardian theme? It’s possible you’ll be questioning how the template hierarchy works in that case.

The excellent news is that it’s fairly easy: WordPress will work by the template information for each themes and use the one which’s highest within the hierarchy. If each themes have the identical file duplicated, then it’s going to use the one from the kid theme. That is how you utilize a toddler theme to override a template file in a guardian theme.

So for instance, my guardian theme has these information:

index.php
front-page.php
web page.php
single.php
archive.php
class.php
404.php
search.php

And my little one theme has these information:

front-page.php
mypagetemplate.php
single.php
class.php
taxonomy.php
taxonomy-productcat-featured.php

Which file do you suppose WordPress will use now for every of those pages?

The house web page (a static web page)
A static web page
A single put up
A product
A product with the featured time period within the productcat taxonomy
An error web page
A search web page
A class archive
A tag archive.

The solutions are under.

The house web page: front-page.php from the kid theme
A static web page: web page.php from the guardian theme (or mypagetemplate.php from the kid theme if I choose that within the web page admin display screen)
A single put up: single.php from the kid theme
A product: single.php from the kid theme
A product with the featured time period within the productcat taxonomy: taxonomy-productcat-featured.php from the kid theme
An error web page: 404.php from the guardian theme
A search web page: search.php from the guardian theme
A class archive: class.php from the kid theme
A tag archive: archive.php from the guardian theme

Notice that if a template file from the guardian theme is increased within the hierarchy than all of the information within the little one theme, then the file from the guardian theme can be used. It’s solely when the information are duplicated that the kid theme’s file trumps the guardian theme’s file, or if the kid theme’s file is increased within the hierarchy.

Understanding the Template Hierarchy Will Make You a Higher Particular person Theme Developer

Phew! We’ve lined loads on this put up and I’ve requested you to do some pondering. Hopefully you now perceive how the template hierarchy works and you should use it to establish which template file WordPress will use to show which web page in your website.

The template hierarchy is a good characteristic of WordPress: it retains issues clear and logical, and for those who make reference to it when constructing your themes, you shouldn’t go fallacious.