Understanding WordPress Template Hierarchy

279
wordpress template hierarchy

WordPress is a simple, yet powerful Content Management System(CMS) build with PHP. A CMS is software that helps users create, manage, and modify content on a website without the need for specialized technical knowledge. WordPress is an open source software and any one can use, study, change and redistribute its source code. WordPress powers more than 40% of all websites on internet.

Our main aim is to develop a WordPress theme. But, before we deep dive into WordPress development, we need to make clear understanding of basic things such as WordPress template hierarchy. So, in this article, we will cover the structure and understanding of WordPress template hierarchy.

Overview

This is a complete template hierarchical structure of WordPress. It shows which individual file to use on individual pages. So, it makes our customization easy while editing our code. WordPress searches down through the template hierarchy until it finds a matching template file. To determine which template file to use, WordPress:

  1. Matches every query string to a query type to decide which page is being requested (for example, a search page, a category page, etc);
  2. Selects the template in the order determined by the template hierarchy;
  3. Looks for template files with specific names in the current theme’s directory and uses the first matching template file as specified by the hierarchy.

Home Page

By default, WordPress sets our site’s home page to display our latest blog posts because WordPress was built as a CMS. But we can customize as our needs. If front-page.php exists, WordPress will use this template file for both settings latest blog posts and static page. If there is no front-page.php present in the home directory, it will display the home.php file. However, if it doe not find the home.php file, it will ultimately display index.php file.

Single Post Page

The template hierarchy to display posts is as follow.

single-{post-type}-{slug}.php
single-{post-type}.php
single.php
singular.php
index.php

WordPress will look for a unique template file for each post you load, within its specific category. If the platform can’t find a relevant template, it will pedal back to single-{post-type}.php. To display a single blog posts, WordPress uses single.php file. If it is unable to find single.php file, it will search for singular.php file. And if it is also not present, it will display the index.php file.

Single Page

Single page is a `page` post-type in wordpress template hierarchy. It is a static page. Pages are rendered in the following order:

page templates
page-{slug}.php
page-{id}.php
page.php
singular.php
index.php

The hierarchy works same as Posts. When we search for a specific page, it will search for the name page-{slug}.php file. If not present, it search for the page followed by id . On unsuccessful finding those pages, it will display the `page` which will defined the page template. As always, all lines lead to index.php in the end, if you don’t get off at an earlier files.

Category and Tags Pages

The template hierarchical structure for category and tags are similar to pages and posts. Below is a list that wordpress will search according to the accending order.

category–{slug}.php
category-{id}.php
category.php
archive.php
index.php

WordPress will look for a template that’s unique to the category you want to load, first by looking for a filename that includes its slug, and then by moving on to its ID. If that approach fails, it will go with category.php instead, and then archive.php.

Custom Post Types

Custom post types are different kinds of content that you may not want to bundle with posts or pages. It lets you organize your content in a more manageable way with your own custom template. It has a comparatively simple hierarchical structure than posts and pages.

archive-{post_type}.php
archive.php
index.php

Firstly, WordPress will search out for archive page with post type joined by dash. For example, if the post type is Books, it will search for archive-books.php. If it is unable to find, it will display a general archive.php page. And ultimately, index.php page.

Search Results Pages

As you can see in the hierarchical image above, it only have two hierarchy. If something is searched, it will searched for a search.php page. If found, it displays the template. However, if there is no file with that name, index.php file will be display instead.

search.php
index.php

404 Error Page

Well, this is the type of page that never want your user to see it. However, it is very important to have one. It have same hierarchical structure as search page. Like other pages, we need to adjust our appearances separately.

404.php
index.php

First of all, it search for 404.php page when a specific page is not found. If we define our 404.php page, it will display otherwise, redirect to the index.php page. It is always good to define a 404 page because it gives a clear information about the error that a user is having in the website.

Conclusion

The most important and the first thing to learn before diving into WordPress theme development is to learn about the Template Hierarchy. Because, once you understand the hierarchical structure, it will helps to organize the things accordingly and reduces the chances of error maximizing the production. WordPress is smart enough to search for different files in no time and displays accordingly. However, if nothing is found, a index.php is displayed .

Read More Articles

LEAVE A REPLY

Please enter your comment!
Please enter your name here

This site uses Akismet to reduce spam. Learn how your comment data is processed.