WordPress Template Hierarchy

Difference between style.css and index.php?

TL;DR: SarpSTA  asked about style.css and index.php — I responded that they are the minimum requirements to create a functioning Theme and explained their roles in WordPress.

I’ve been attempting to frequent online discussions more for Web Development. I feel it’s time for me to attempt to give back to a place of knowledge that helped me a great deal throughout my career.

One of those key communities is StackExchange.

There was a recent question, though poor in quality, around what is the difference between “style.css” and “index.php”. Now asking a question like that says a few things to me:

  1. The person asking may be very new to Web Development and/or WordPress.
  2. They may not understand what CSS is or what PHP is.
  3. They may simple not know what roles these files play in the building of a Theme.

Regardless, it’s not a question I had ever asked myself and thus had never explained to anyone. I read the documentation one time and it all made sense. Thus I had moved on from there.

But it is a fundamental question when building things, as to what value these files bring and a probably a better question to ask is “why are these two files in particular the minimum required files to be a valid Theme?”

My answer (still not accepted and probably won’t be – grr) is this:

Style.css contains File Headers which are needed to outline basic information about your Theme. The index.php file is meant to be the primary fallback file for your theme.

It’s the “there are no other templates available to display for these pages, so we will end up at index.php.

In short, these two files are the minimum required files for every Theme. The CSS file outlines the initial information on the Theme and is also where styling for the Theme can go.

The index file is the primary template file and it’s default purpose is to try and show data from WordPress. Most people go well beyond using index.php when building themes though.

Leave a Reply