WORDPRESS THEMES PA R T II: DESIGNING AND DEVELOPING
THEME BASICS
You may already be somewhat familiar with WordPress themes and the premises under which
they operate. In theory, themes are a way to separate the design from the code, but in reality,
there is still a lot of coding happening in the more advanced themes out there.
A theme consists of a folder with template files and any other files that may be needed. The
only two absolutely necessary template files are style.css and index.php. The former contains
the header that identifies your theme (and generally some styling code), and the latter is the
basic layout. If you’re looking for a challenge, try to create a WordPress theme consisting of
just the two necessary files and see what you can do with it. This is an interesting exercise if
nothing else.
ELEMENTS OF THE BASIC THEME
Figure 4-1 shows a common blog layout. At the top, spanning the full width, is the blog
header, which in fact is the header.php file. Underneath is the actual blog area, with the
content to the left (index.php) and the sidebar to the right (sidebar.php). Finally, there
is a footer to wrap it up, using the footer.php template file.
This setup is not mandatory; you can change it, exclude parts of it, or expand it further. It is,
however, a very common setup, one that the former default WordPress themes Twenty Ten,
Twenty Eleven, and Twenty Twelve all adhere to, as well as Twenty Fourteen in its own way.
You can find a lot of themes using template files in this manner, but it is in no way the only
way to do things.
Although you can get by with just style.css and index.php in your theme, it is generally not
such a good idea to be so minimalistic. At the very least, you should also have a header.php and
a footer.php for your theme. These are called from within index.php, with the template tags
get_header() and get_footer(). You’ll also want a comments.php file for commenting
functionality, and you call that with comments_template(), also from within index.php.
The same goes for the sidebar; you should have a template file for that, too, and call it with
get_sidebar().
The header.php file consists of the doctype heading and everything related. You’ll get a closer
look at that in a later example section. The header.php file also generally does basic tasks such
as getting the right favicon, generating proper title tags, and having the necessary keywords so
that search engines can find the pages more easily. However, one thing it must have is a link to
the style sheet, and wp_head() is also needed to start the whole WordPress shebang.
The footer.php file should include wp_footer() to stop WordPress and, of course, all the
necessary closing tags. Make sure to close the body and html tags and anything else you may
have opened in header.php.
Finally, comments.php needs the code for outputting comments, as well as the necessary
forms so that people can actually post new comments. This is done with simple template tags
these days, so comments.php files aren’t as messy to work with as they once were. The
simplest file of all is sidebar.php, which is just the stuff you want in the sidebar.