WordPress Theme Templates: Header Overview

By Lisa Sabin-Wilson from WordPress Web Design For Dummies

A WordPress theme, in its very basic form, has four main areas that appear in the default theme that comes in every version of WordPress. The Header template is the starting point for every WordPress theme because it tells web browsers the following information:

The title of your site
The location of the CSS
The RSS feed URL
The site URL
The tagline (or description) of the site

In many themes, the first elements in the header are a main image and the navigation. These two elements are usually in the header.php file because they load on every page and rarely change. The following statement is the built-in WordPress function to call the Header template:

<?php get_header(); ?>

Every page on the web has to start with a few pieces of code. In every header.php file in any WordPress theme, you find these bits of code at the top:

The DOCTYPE (which stands for document type declaration) tells the browser which type of XHTML (Extensible Hypertext Markup Language) standards you're using. The Twenty Ten theme uses <!DOCTYPE html>, which is a declaration for W3C (World Wide Web Consortium) standards compliance mode and covers all major browser systems (and is the markup doctype specifically for HTML5).
The <html> tag (HTML stands for Hypertext Markup Language) tells the browser which language you're using to write your web pages.
The <head> tag tells the browser that the information contained within the tag shouldn't be displayed on the site; rather, it's information about the document.

In the Header template of the Twenty Ten theme, these bits of code look like the following example, and you need to leave them intact:

<!DOCTYPE html>
<html <?php language_attributes(); ?>>
<head>

On the Edit Themes page, click the Header template link to display the template code in the text box. Look closely, and you see that the <!DOCTYPE html> declaration, <html> tag, and <head> tag appear in the template.

The <head> tag needs to be closed at the end of the Header template, which looks like this: </head>. You also need to include a fourth tag, the <body> tag, which tells the browser where the information you want to display begins. Both the <body> and <html> tags need to be closed at the end of the template, like this: </body></html>

There is one line of code that should exist in every Header template for any WordPress theme: <?php wp_head(); ?>. This tag serves as a hook in WordPress that plugin developers use to insert necessary code and functions. Without this tag, the majority of plugins for WordPress will not function correctly, so be sure your Header template includes the tag <?php wp_head(); ?> before the closing </head> HTML markup.