Join Morten Rand-Hendriksen for an in-depth discussion in this video What is IA and the template hierarchy?, part of WordPress Developer Tips: Information Architecture and the Template Hierarchy.
This WordPress developer tip revolves around two key terms in web design and in WordPress development. IA and the WordPress Template Hierarchy. So before we dive in, let me explain briefly what these two terms mean. IA is shorthand for information architecture. If we ask Wikipedia, information architecture is the structural design of shared information environments, the art and science of organizing and labeling websites, intranets, online communities and software to support usability and findability.
This is all a really fancy way of saying information architecture is the drafting out of the structure of the website and its content. Meaning before you create any content you should draw a diagram that shows each of your pages or each of your pieces of content. And draw lines between them so you can clearly see how each page relates to the other. And see the pathways your user will go through when she goes from one page to the other. And that way you can ensure that if a user lands on any particular page or any particular piece of content within your site, she can easily find the path to where she wants to go within your site.
The WordPress Template Hierarchy is closely related to information architecture. In fact, when you look at the graphic that displays the WordPress Template Hierarchy, you are looking at information architecture. Only this time, you're looking at information architecture created for WordPress itself. The WordPress Template Hierarchy is the system WordPress uses to figure out which template to use any time a visitor visits a page or an index page or a single post. WordPress moves from left to right through this diagram to figure out which template kicks in.
We start out by asking what type of page is this? And then we narrow down the searches and see if the template files exist. If they exist they are automatically used. If they don't exist, WordPress will keep going down the chain and use the next best template or the next best template. And in the end we'll end up either using the template in question, in this case the single.php template for a single post, or if no template is available, we'll fall back to index.php, which is the default template for everything inside WordPress.
That said, in normal WordPress websites, the index.php template is only used for the blog index page and nothing else. To see how this works in practice, let's imagine that a visitor visits a single post. WordPress will ask what type of page is this, and immediately find out it's a singular page, it's a single post page, and in this case, it's a blog post. Now WordPress will look for a template file called single-post.php. If that template file exists, it will be used.
If it doesn't exist, it will fall back to single.php and use this file instead. And single.php is the default template file for single posts. Looking at the template hierarchy, you'll see there are other pathways too. If you're looking for an archive page, let's say a category archive, you see here we have multiple different template options. The default option is category.php, but you can also create a custom category template file called category, dash, and then the ID number for a specific category.
Or category, dash, and the slug for a specific category. If you have custom post types, you can also create custom post type templates both for archive pages and for single posts. And for single posts, that custom post type template will be called single-PostType name.php. And finally, if you want to manage what displays on the front page, you can either use the standard index.php, which displays your blog index. You can assign a custom page to be the front page.
Or you can create a new template file in your theme called front-page.php. And this template file will automatically display in place of all the other templates. So now that you're familiar with both IA and the WordPress Template Hierarchy, we're ready to look at how these two can combine to create a better pre-process before you start building WordPress websites.