Template hierarchy in Wordpress

Introduction

Template hierarchy helps WordPress decide which file to use to show your website pages. It makes your site organized and flexible.

You want to customize how your homepage looks differently from other pages.

You need a special layout for blog posts but a different one for pages.

You want to show a unique design for posts in a specific category.

You want to create a custom error page when a visitor lands on a missing page.

You want to control how archives or search results appear on your site.

Syntax

Wordpress

index.php
home.php
single.php
page.php
category.php
404.php
archive.php
search.php

WordPress looks for templates in a specific order, starting from the most specific to the most general.

If a specific template file is missing, WordPress uses the next one in the hierarchy.

Examples

This template is used for a single blog post of the type 'post'.

Wordpress

single-post.php

This template is used for the page with the slug 'about'.

Wordpress

page-about.php

This template is used for posts in the 'news' category.

Wordpress

category-news.php

This template is used when a page is not found (error 404).

Wordpress

404.php

Sample Program

This code shows a custom template for the About page. WordPress will use this file when the visitor opens the About page.

Wordpress

<?php
// Template hierarchy example in WordPress theme
// This is page-about.php
get_header();
?>
<main>
  <h1>About Us</h1>
  <p>Welcome to our custom About page.</p>
</main>
<?php get_footer(); ?>

Important Notes

Always include get_header() and get_footer() to keep your site consistent.

Use template hierarchy to avoid repeating code and to organize your theme files well.

Check WordPress documentation for the full template hierarchy chart to understand all possibilities.

Summary

Template hierarchy tells WordPress which template file to use for different pages.

It helps you create custom layouts for posts, pages, categories, and errors.

Following the hierarchy keeps your theme organized and flexible.

Practice

1. Which template file does WordPress use first when displaying a single blog post?

easy

A. archive.php

B. page.php

C. index.php

D. single-{post-type}.php

Solution

1. Step 1: Understand single post template priority

   WordPress first looks for single-{post-type}.php to display a single post of a custom or default post type.

2. Step 2: Recognize fallback templates

   If that file is missing, WordPress falls back to single.php or index.php, but the first choice is single-{post-type}.php.

3. Final Answer:

   single-{post-type}.php -> Option D

4. Quick Check:

   Single post uses single-{post-type}.php first [OK]

Hint: Single posts use single-{post-type}.php first [OK]

Common Mistakes:

• Confusing page.php with single post template
• Thinking archive.php is for single posts
• Assuming index.php is always used first

2. Which of the following is the correct template file name to display a category archive for category with slug 'news'?

easy

A. news.php

B. category-news.php

C. category.php

D. archive-news.php

Solution

1. Step 1: Identify category archive template naming

   WordPress uses category-{slug}.php to display a specific category archive page.

2. Step 2: Match slug to template

   For category slug 'news', the template file is category-news.php.

3. Final Answer:

   category-news.php -> Option B

4. Quick Check:

   Category archives use category-{slug}.php [OK]

Hint: Category archives use category-{slug}.php [OK]

Common Mistakes:

• Using archive-news.php which is invalid
• Confusing category.php as specific slug template
• Naming file as news.php which is not recognized

3. Given the following files in a theme: page-about.php, page.php, and index.php. Which template will WordPress use to display the About page?

medium

A. page-about.php

B. page.php

C. index.php

D. It will show a 404 error

Solution

1. Step 1: Check for page-specific template

   WordPress looks for page-{slug}.php first for pages, so page-about.php matches the About page slug.

2. Step 2: Understand fallback order

   If page-about.php exists, WordPress uses it before falling back to page.php or index.php.

3. Final Answer:

   page-about.php -> Option A

4. Quick Check:

   Page slug template overrides generic page.php [OK]

Hint: Page slug templates like page-about.php have priority [OK]

Common Mistakes:

• Choosing page.php ignoring slug-specific template
• Assuming index.php is used first
• Thinking About page shows 404 without template

4. You created a template file named single-post.php but WordPress still uses single.php to display posts. What is the likely problem?

medium

A. The file name should be single-post.php but WordPress uses single-{post-type}.php where {post-type} is the actual post type slug

B. The correct file name is single-post.php but it must be in a subfolder

C. The file should be named single.php for posts

D. WordPress does not support single-post.php templates

Solution

1. Step 1: Understand post type template naming

   WordPress uses single-{post-type}.php where {post-type} matches the post type slug exactly.

2. Step 2: Check post type slug for 'post'

   The default post type slug is 'post', so single-post.php is correct if the post type is 'post'. But if the post type is custom or named differently, the file name must match exactly.

3. Step 3: Identify common mistake

   If WordPress ignores single-post.php, it may be because the post type slug is not 'post' or the file is misplaced.

4. Final Answer:

   File name must match actual post type slug in single-{post-type}.php -> Option A

5. Quick Check:

   Template file must match post type slug exactly [OK]

Hint: Match single-{post-type}.php exactly to post type slug [OK]

Common Mistakes:

• Assuming single-post.php always works for posts
• Thinking file must be in a subfolder
• Believing WordPress ignores single-{post-type}.php files

5. You want to create a custom template for the tag archive page of the tag with slug 'featured'. Which template file name should you create to follow WordPress template hierarchy?

hard

A. archive-featured.php

B. tag.php

C. tag-featured.php

D. taxonomy-featured.php

Solution

1. Step 1: Identify tag archive template naming

   WordPress uses tag-{slug}.php for tag archive pages with specific slugs.

2. Step 2: Match slug to template file

   For the tag slug 'featured', the correct template file is tag-featured.php.

3. Step 3: Understand fallback templates

   If tag-featured.php is missing, WordPress falls back to tag.php or archive.php.

4. Final Answer:

   tag-featured.php -> Option C

5. Quick Check:

   Tag archives use tag-{slug}.php [OK]

Hint: Tag archives use tag-{slug}.php for custom tags [OK]

Common Mistakes:

• Using archive-featured.php which is invalid
• Confusing taxonomy-featured.php with tag template
• Assuming tag.php is always used for all tags