A Rundown of WordPress Theme Files and What They All Do

The inner working of theme files

WordPress themes are typically built using a handful of PHP files and a single CSS file. To beginners, it can be a little confusing to know what’s what and how they all work together and I hope to give you the basics in this tutorial.

Where the files are kept

From the root of your installation, you can navigate to /wp-content/themes/ to see all of the themes that are installed on your site. Unless there are any errors, each folder represents a unique theme, though you could also have some child themes, which can be considered duplicates depending on how much editing you did.

The required files

There are just two files that are absolutely required by WordPress to create a theme. These are index.php and style.css:

index.php

The index.php file is the default file that is used to display the latest posts. It will also be used to display archives, tags, search results and categories if those specific files are not in place.

style.css

The style.css file takes care of how your theme looks for the most part. It is where you specify things like background colors and images, font sizes and colors, widgets colors and styles, image borders and margins, and your different font styles (such as h1, h2, h3, links etc.).

Front page / Home Page

front-page.php

This is a special file that supersedes page.php if you are using a static page as the front page of your site (you can set this in Settings > Reading). If you don’t have a front-page.php and you’ve set a static page for your front page, page.php will be used (unless you’ve set a specific template for the page).

home.php

The home.php file sets how your home page will look if you are using it to display your latest posts (as opposed to a static page). In its absence, index.php will be used.

Adding functionality with functions.php

The functions.php file is an optional file, which serves several purposes: it can be used to define functions that can be used in several places throughout your theme (removing the need to paste the whole function in several places), to create additional menus in the admin area, or to enable theme features like post thumbnails. If your theme doesn’t yet have a functions.php file, you can create one yourself and start adding in your own functions – just make sure that you start your file with an opening PHP tag and then paste your functions on the next line.

Posts and pages

Probably the next most important theme files are page.php and single.php. Predictably, page.php is used to display your static pages and single.php is used to display individual posts.

If you are using custom post types, you can set a different single.php template for every custom post type you are using. For example, for the custom post type gallery, the template file for individual posts using this custom type is single-gallery.php. If a specific template for the custom post type doesn’t exist, the default single.php will be used instead.

Page elements

WordPress pages typically consist of a few key elements: a header, a footer and one or more sidebars. You can code these right into your individual theme files, but it is better to create new files for them and call them from individual theme files, since these elements rarely change from page to page.

header.php

The header.php file typically is used to define any HTML head declarations, such as specifying stylesheets or favicons and for displaying a header image and/or navigation bar. If your theme has a header.php, you can load the header in your other theme files by using the following call:

footer.php

The footer is handy for displaying copyright information, static links and for loading burdensome JavaScript after the rest of your page has loaded. All you need to do is create a file called footer.php and enter all your footer code in it. Then you can call the footer in other files by using:

sidebar.php

Sidebars are where you can use widgets and display information on numerous pages. If you have a single sidebar, you will use the following call to display it in other theme files:

However, if you have two sidebars, you will need to create sidebar-1.php and sidebar-2.php for instance and then use the following calls to display them in your theme files:

comments.php

This file is used to both display the comments at the end of a post and create a form so that your readers can leave a comment. You can tweak how comments and the comments form are displayed by modifying this file.

Archives

Your front page isn’t the be all and end all of your site. Hopefully, through internal linking, you’re encouraging your readers to look through your old material. WordPress uses a few different files to display your archives, depending on what kind of archive you’re needing to display.

author.php

This file displays all the posts written by a particular author. You can take it a step further and use different templates for different authors by adding the author ID or ‘nice name’ to the filename, like author-5.php or author-dave.php.

category.php

This file will display all the posts in a category. Again, you can create specific category templates by adding the category ID or slug to the filename, like category-12.php or category-books.php.

date.php

This file will be used when displaying posts from a given time period, such as a year or date.

tag.php

Tags are an excellent way of categorizing posts and this file will set how posts are displayed when a particular tag is queried. Tag slugs or IDs can be appended to the file name to create specific templates for particular tags, e.g. tag-wordpress.php or tag-83.php

archive.php

This is the default archive template that is used if date.php, tag.php, archive.php or category.php don’t exist. So if you only have archive.php and author.php in your theme, category.php will be used when displaying posts from a particular category, but archive.php will be used when querying a date, tag or an author’s posts.

search.php

This file is used to display the results of a search, believe it or not. In its absence, index.php will be used.

Attachments

Using WordPress’ built-in document uploading system, you can link images and attachments to an attachment page, or directly to the file.

attachment.php

attachment.php will be used to display attachments when you upload attachments and specify that they be linked to an attachment page, rather than the source file. This allows you to keep your site branding and display ads for instance, while still providing access to the attachment.

image.php

If you want to display attached images differently to other attached files, you can use image.php to dictate how they should be shown. All other attachments will continue to be displayed using attachment.php

Miscellaneous theme files

Files which don’t fall under any of the previous categories include:

404.php

Hopefully, it’s fairly obvious what this file does: when someone requests a page on your site that doesn’t exist, the server kicks up a 404 error and this template is used to display the error page. You can use this to your advantage to display a search form so that the reader doesn’t give up and go elsewhere looking for the information. Use the search form call shown below in 404.php:

Is there anything that you’re not sure about? Not sure which file to use where and when? Leave a comment and I’d be happy to help you out.

12 thoughts on “A Rundown of WordPress Theme Files and What They All Do”

  1. AstroGremlin says:

    Hey Dave,
    Found you on Harrison’s site, and glad I did! You reveal some of the deep mysteries of WordPress which, sadly, the Codex utterly fails to do.

    Not that I don’t love coding (actually I have not much of a clue) but is there a Plug-in that lets one switch the appearance of Posts without losing advertising, affiliate ads, links to RSS, Facebook, etc.? When I change the Theme on a Page (possible through Headspace), it loses all the settings sidebar stuff I’ve painstakingly added.

    1. Hi there. Glad you found me. What is Harrison’s site? I’d be interested to go and have a look!

      So it sounds like you’re mainly referring to widgets? And when you switch themes, your widget settings are lost?

        1. Ahhh excellent! Now I’ll go check it out. Thanks for coming back and leaving the link for me. Appreciate it.

  2. AstroGremlin says:

    I can’t find the Harrison’s site — looks as though I forgot to bookmark!

    When I switch to a new Theme, none of the widgets are in the design, the sidebars are blank. Not sure about the settings — but the widgets aren’t there . . .

    1. How about this – activate that theme for the whole site and set up your widgets the way you want. Then revert to your normal theme. Both themes should then have saved settings for the widgets and when Headspace forces another theme on a page, it should bring up the sidebar settings too

  3. AstroGremlin says:

    Thanks, Dave. Progress, and I use the term facetiously, was made when I tried a plugin called Theme Tester and it lost all my ad settings, new and old. Trying to revert to a backup failed. So switched to a new theme, put in all new ad links, then, when I deleted Theme Tester, the page reverted to my old Theme, without the ad settings. Arrgh. At least I’m moving away from TwentyTen, which screamed “newbie.”
    I’m pretty sure I want to buy a pro Theme called Thesis. Any opinions?

    1. Thesis is a very good theme framework. I actually prefer Genesis myself (looks cleaner out of the box), but Thesis is certainly a good option.

  4. Hi and thanks! I have a question (maybe a bit off topic) that I haven´t figured out myself:
    When it comes to improving page speed, Do you consider a theme with lot of template files OR a huge index.html jammed with conditional tags (as in http://codex.wordpress.org/Conditional_Tags)?

    I´m not a coder but a designer that learned wp, and sometimes I have a hard time making the best choices. Thanks!

    1. Conditional tags have their uses, however, they should not be used to determine whether you’re on a single post, so that you can tell WP how to display it. They should instead be used for determining the site title in header.php for example, which will be different if you’re viewing the home page, or a single page.

      You should use multiple theme files to dictate different displays; there’s no sense in loading a massive index.php file when most of it is not applicable. It’s also beneficial to call largely static elements, like the sidebar and footer from separate files because they can be cached for quicker loading.

      So in summary, don’t use conditional tags to layout your theme in a giant index.php file, use as many of the files that WordPress gives you to create all the different displays that you need.

  5. Haha
    “…huge index.html jammed…”
    as in
    “…huge index.php jammed…” (
    Not a coder, surprised? ;)

Leave a Reply