In this video, learn about the template hierarchy system in WordPress.
- [Instructor] So far we've covered CSS, and Functions. Two very different ways to customize Wordpress. CSS is very easy to change and doesn't require programming knowledge. While writing and customizing Functions in PHP is pretty advanced. It's something that theme and plugin developers have to do all the time. Customizing Wordpress templates is somewhere between these two options. Wordpress themes have a bunch of template files included. And these template files are a mixture of HTML code, Template Tags, and PHP code. You can think of them as a place where everything comes together. As an example, we want to display our post's title and Rapid in HTML code. All of that happens in a template file. Some of the more common templates are listed on this page. Index.php is the primary template that Wordpress uses, and it is required in a parent theme. Front-page is for your website's main page. So if you want your Homepage to look different, you can customize this template. And 404 is for when Wordpress can't find the page in question. There's a very handy visual overview of the Template Hierarchy in Wordpress. If you open this graphic you start on the left-hand side to see what type of page you request. And you move right until you find the template that's in your theme. That's the template that Wordpress will use to render your page. So if a user is scrolling through our backlog of posts, they start at Archive Page. And you can actually scroll through the backlog in a few different ways. You can scroll by category, or by tag. You can also scroll by date, or by author. And a few more. Let's say our user is scrolling through our Recipes category. That means we move to the Category Archive. If our theme happens to have the category-recipes.php that's the file that Wordpress will use to render that page. If that file doesn't exist, we go further to the right to find the next template file. So this chart is a little like a flowchart. Once you know what type of page your user wants to load you can see how Wordpress selects the right template to use. So if we don't have a specific category template, then Wordpress will try to load category.php. If that doesn't exist then it will load archive.php. And finally, if that doesn't load the ultimate fallback is index.php. Once you know how this works if you ever want to customize a template for a specific type of content you just have to reference this guide and then create or customize a template for that type of content. There's a very handy plugin called Show Current Template. I've already installed and activated the plugin. And as I click through my site, you can see the different templates used. So let's go the site. Up here you can see right now we're using the page.php template, and some of these specific template files included in that template are right here. So let's go the the About page, that'll also be page.php, let's go to the Blog page, that will use the index.php template, and let's look into this recipe. That's using single.php, which is a single post. If we go back to our template hierarchy we can see single.php is right here. Now that you have an idea of what templates you have to create or edit to see changes in your theme, let's go ahead and start making some changes.
- Setting up your development environment and editor
- Picking a parent theme
- Creating a child theme
- Including style sheets
- Creating and modifying styles
- Modifying functions
- Hooking functions
- Creating and modifying template files
- Adding menus and functionality
- Migrating theme files to a live WordPress site