For the last two months we’ve been talking about PHP. The month before that, we discussed tables, ids, classes, and other rules and concepts that are important for developing a website theme.
All of that is important, very much so. You couldn’t develop a website without it. However, what I have not yet explained is the actual body of the website – the part of the code that tells the browser what it’s supposed to show people who visit your website. Everything else is important, true, but this is the most important part of all.
And, well… to have a great website, you need a great body. Er… <body>. So in website terms… what makes up a good body?
Header
Note that the header is completely different from the head of your website. The head goes at the very top of your code (right after the doctype declaration), and includes stuff like links to your CSS and JavaScript files, metadata, and other information about your website. None of which is actually displayed.
The header, on the other hand, is displayed. It’s what you see at the very top of just about every website out there. Here on SushiCodes, my header consists of our logo and my navigation bar. It’s exactly the same on every single page within my website.
Because the header is the same on every page in our website (and this holds true for most websites out there), we can use a single header.php file (go look! More likely than not, there’s already a header.php file in your theme) and just include it on every page we make in the website. Convenient, isn’t it?
Footer
As the name suggests, the footer goes at the foot – or at the bottom – of your website. As with the header, most footers are exactly the same on all pages – they usually include copyright information, sometimes an abridged version of the navigation, and can include other information such as who developed your website. And, as with the header, since it’s the same on every page in your website, you can just use one footer.php file, and include it on every page. Easy peasy.
Sidebar
The sidebar goes – you guessed it – at the side of your website. Now here’s where it gets a tiny bit more complicated. But don’t be scared. We can handle this.
The easiest scenario is when you have one sidebar that stays exactly the same on all pages. In this case, all you have to do is include a single sidebar.php file, just like with the header and footer. (Actually, that’s a lie. The very easiest scenario is when you don’t have a sidebar at all. But in that case, this section about sidebars doesn’t even matter, right?)
But then there are the cases when you have different sidebars depending on what page you’re on, or two sidebars next to each other, or one sidebar on either side of the content… this is where it gets a little more involved. In some of these cases, you’re even going to have to have multiple files for the sidebar.
But not to fear! I am here… and I am here for you. In upcoming weeks as we go through the body section of WordPress themes, I will explain this, all of this, and by the end of it you’ll be able to create sidebars like a pro.
Content
Unlike the header, footer, and even the sidebar, your content section is going to be different on every page of your website. I mean it. Every single page of your website is going to have different content. (Because why on earth would you want two pages to look exactly alike? That’s just silly. Not to mention redundant and kind of pointless.)
So does this mean you have to have a different file for every single page on your website, since they all have different content? (If you have a blog, this can number into the hundreds, or even thousands.)
No, not at all.
big sigh of relief
You see, although the content on every page is going to be different, many of the pages have the same format. Take your blog posts, for example. Generally, blog posts consist of a title, the date it was posted, the author’s name, the actual post itself (consisting of words and pictures, usually), metadata, comments, and a comment form. And maybe some social media buttons and links to similar posts.
Every website is different, but within a website, every single blog post is going to consist of the same elements. So really all we have to do is make one .php file (usually single.php in your WordPress themes) that sets up the format for the blog post pages… and voila, all that’s left to do is insert the content for that particular blog post! Which is super duper easy. You won’t even break a sweat doing it. And… drum roll, please… you use PHP to insert the content, so you don’t even have to know which post the user is looking at! Your server does all the work for you. Ain’t it great?
Then there are other pages, like your About page (super duper easy), Archives page (easy), Contact page (a little harder, but plugins can help with this!), Shop page (also something plugins can make much easier… woo!), etc., etc…. depending on what’s in your pages, you can use the basic page.php template (like for the About page), or you can create additional templates that fit the format of your other pages. For example, here on CodeSwan I have one for my Archives page and another for my Contact page, since their styles are fairly different from my basic pages.
So there you have it, everything that makes up a WordPress theme!
Well… sort of. The rough outline, at least.
Next week, we really start discussing what makes up a website, as we look at all that comprises the header (not head! We already did that!) section of your website.
