BUILDING A WEBSITE | PART 10 – THE WORDPRESS THEME

POSTED ON DECEMBER 31, 2011 BY MATTSICH |

So you have WordPress installed but what now? … Themes

WordPress is often misjudged or overlooked. Not many people see its potential to be something more that a blog. Now with the introduction of custom post types in wordpress 3, we can do some pretty amazing things while still keeping it all easy to manage.

Today we will simply take a quick look at the files that will make up your theme.

Index.php

The index page controls the landing page (i.e. the main page). At its most basic form it includes the header, runs a loop of all the posts, includes a sidebar and then includes a footer. It doesn’t have the body or head tags. It has only the content of the page that will change from page to page.
What do I mean by includes? In php there is a function for using the contents of an outside file in a current file. The actual function is include(); but when we include the header, sidebar, and footer, wordpress has some predefined function to make our life easier. For example, to include the header file, you would use the get_header(); function.

Hopefully you read my previous tutorials where I talk about why we separate a website into the components header, content, and footer… but if not, I’ll summarize: we separate the files because we usually reuse the same header and footer so instead of writing the same code in each file over and over again, we just include the header and footer files.

header.php

The header file contains the head tag and ends with the navigation of the website (usually). You include the usual stuff that you would in the head tag such as the links to the css files and javascript files but you also need some things that wordpress requires. We will go over all of these in the next tutorial.

footer.php

The footer is usually very simple. It simply closes all the tags that were opened at the end of the header and you can add a nice end to the page if you like.
One of the most common mistakes is that people forget to announce to wordpress that this is their footer file. This is also done in the header file. For the footer the function is wp_footer(); and the header one is wp_head();

page.php & single.php & search.php & archive.php

I grouped all these together because there is not much difference between them all. They all resemble the index.php file… they are just used in different places on the blog.

The page file is used for displaying pages.
The single file is used for displaying single posts (it also includes the comments file)
The search file is used for showing the results of a search
The archive file is used for showing the result when someone looks at a certain narrowed down set of posts.

functions.php

The functions file is most commonly used to simply register the sidebar but can also be used to add all kinds of compatibility and filtering to your theme. It’s basically manages how many of the predefined functions and stuff like that are returned to you when you used them in the other theme files.

404.php

This file handles what a visitor sees if he is directed to a place on your blog that doesn’t exist (called a 404 error).

style.php

The style page is a quite obvious necessity and therefore it is a pivotal part of the theme.

In the next tutorial we will start coding the header, footer and index pages.

No Responses to this post

Leave a Reply