The WordPress Twenty Fifteen Header Template - dummies

The WordPress Twenty Fifteen Header Template

By Lisa Sabin-Wilson

The Header template is an important part of your WordPress website. 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 (document type declaration) tells the browser which type of XHTML (Extensible Hypertext Markup Language) standards you’re using. The Twenty Fifteen 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 (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 Fifteen theme, these bits of code look like the following example, and you need to leave them intact:

<!DOCTYPE html>
<html <?php language_attributes(); ?> class=“no-js”>

On the Edit Themes page (choose Appearance → Editor on the WordPress Dashboard), 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 files (in footer.php), 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.