Part 2: header.php

So here is the first ring on our chain. header.php.
Before we begin, I want you to look at this file header.txt. This is the code for header.php. If you ever want the whole picture, look at this file. Also I added some explanation there.

I divided the code in this file into five sections. Let’s see.
Section 1
Here is where the html tag starts. This tag will be closed in the footer.php file. This is mandatory for every website.

Section 2
This is where the head tag starts and it will be closed below the codes. Here is everything that wordpress has to get from all the files. You have the style.css included here, the wordpress head function etc. Also, like in .php here is the place where you put code lines for scripts, fonts and other functions you want on your website. All these codes are mandatory too. So this section must stay like this.

Section 3
This is where the body tag starts (will be closed in footer.php file too). Here is what’s showing on your website (from here in header.php until footer.php where it’s closed – basically the whole chain we talked about.

Section 4
Now comes the coding. As I said in the document, I chose to have my container starting with the header image first. But you can start with the container code (attention, only the container one, not content div). So I opened a header div, I put my navigation in there and I closed them both. Now I am done with the upper part of the theme. Simple, no?

Section 5
Here is where my container starts. My container basically has in it the content and the sidebar (you’ll see later taht I choose my footer to be outside the container too, but you can choose the footer to be in it. How to do that? well, you close the container div after the footer one – this is css so let’s not get into details). So now, we can move on to the actual content of the site, the blog/page box and the sidebar. As I said before in the content box will be shown: index.php, page.php, 404.php and single.php + comments.php. Let’s move to index.php file.