A presentation breaking down the WordPress Template Hierarchy originally presented at the STL WordPress Meetup on October 26, 2015.

1. WordPress Template Hierarchy
Jason Yingling

2. Post vs Page vs Webpage
• Webpage – an HTML document being served
to a web browser. The final output of your
PHP into HTML, CSS, and JS.

3. Post vs Page vs Webpage
• “post” – content stored in the database in the
wp_posts table

4. Post vs Page vs Webpage
• Post – A default WordPress post of type “Post”
• Page – A default WordPress post of type
“Page”
• Posts, Pages, and Custom Post Types are all
stored together in the wp_posts table of the
database with different types (Post, Page,
Product, etc.)

5. Template Terminology
• Template Files – PHP files that determine the site’s
markup.
• Page Templates – “those that apply only to pages to
change their look and feel. A page template can be
applied to a single page, a page section, or a class of
pages.”
• Template Tags – Functions used within template files to
retrieve and return data. (ex. the_title() or
the_content()
• Template Hierarchy – The logic WordPress uses to
determine which template file to use to display certain
data

6. WordPress as a Factory
• posts – The raw materials
• Database – The warehouse
• WordPress theme – The Assembly Line
• The Browser – The consumer
• https://www.youtube.com/watch?v=nR47WZ
GTywE

7. Crucial Templates
• style.css – determines the theme’s visual
appearance and registers the theme with
WordPress
• functions.php – used for presentational
functionality.
• Template Files – determine the site’s markup.
Uses PHP to convert data from the database
into the HTML output to the browser.

8. style.css
• (image of registration header)
• Required by WordPress to register the theme

9. functions.php
• Enqueuing additional stylesheets and scripts
• Creating widgetized areas and menus
Should only be used for presentational functionality
such as:
• Registering Post Types or Custom Taxonomies
• These should go in a plugin so data is not lost when a
theme is switched.
Should not be used for content functionality such as:

10. Template Files
• Always used files – files used in every template
– header.php
– footer.php
– sidebar.php (if applicable)
• Additional files – files that may or may not be
used depending on content / hierarchy
– index.php
– single.php
– page.php
– And more

11. Template Partials
• Allows you to easily reuse code throughout
the theme
• header.php, footer.php, and sidebar.php are
some basic examples
• content.php is commonly used to pull in post
content markup
“A template partial is a piece of a template that is included as
part of another template, such as a site header.”

12. Common Template Files
• index.php – The main template file. Required in all
themes.
• style.css – The main stylesheet. Required in all themes.
• Header.php – Usually contains site’s doc type, meta
info, stylesheets, etc.
• single.php – used when a visitor requests a single post.
• page.php – used when a visitor requests individual
pages
• Many more descriptions available on the Codex -
https://developer.wordpress.org/themes/basics/templ
ate-files/#common-wordpress-template-files

13. Template Hierarchy
• The logic WordPress uses to determine which
template file to use to return requested post
data

14. Everything goes back to index.php
• No single.php template? WordPress will use
index.php
• No page.php template? WordPress will use
index.php

15. https://developer.wordpress.org/files/2014/10/template-hierarchy.png

17. Single Post
• single-{post-type}-{slug}.php - (since 4.4) – WP looks
for a specific post. Fox example, single-product-
shirt.php would work for a product post type with the
slug shirt.
• single-{post-type}.php – If the post type of the data is
Product, WordPress would look for single-product.php
• single.php – If the above don’t exist, WordPress then
falls back to single.php
• singular.php – If single.php doesn’t exist, WP looks for
singular.php
• index.php - If none of the above exist WordPress falls
back to index.php

18. Page
• Custom template file – the page template
assigned to the page
• page-{slug}.php – If the page slug is recent-news,
WordPress looks for page-recent-news.php
• page-{id}.php – If the page ID is 6, WordPress
looks for page-6.php
• page.php
• singular.php
• Index.php

19. Template Hierarchy Resources
• WordPress Codex image -
https://developer.wordpress.org/files/2014/10/t
emplate-hierarchy.png
• Template Hierarchy in Detail -
https://developer.wordpress.org/themes/basics/t
emplate-hierarchy/#the-template-hierarchy-in-
detail
• Interactive Hierarchy map-
http://wphierarchy.com/
• Show Current Template Plugin -
https://wordpress.org/plugins/show-current-
template