functions.phpで定義した設定を実際にサイトの見た目に反映させるのが、テンプレートファイルの役割です。その中でも**header.php**は、サイトの「顔」であり、SEOやプラグインの動作に不可欠な「頭脳」の一部でもあります。
今回は、自作テーマにおける**「正しく、かつメンテナンスしやすいheader.phpの作り方」**を解説します。
header.phpの主な役割は、すべてのページで共通して使われる**「HTMLの宣言からナビゲーションメニューまで」**を記述することです。WordPress専用の関数(テンプレートタグ)を適切に配置するのがポイントです。
1. header.php の基本構造(全体像)
まずは、標準的なheader.phpのソースコードを見てみましょう。
PHP
<!DOCTYPE html>
<html <?php language_attributes(); ?>>
<head>
<meta charset="<?php bloginfo( 'charset' ); ?>">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<?php wp_head(); ?>
</head>
<body <?php body_class(); ?>>
<?php wp_body_open(); ?>
<header class="site-header">
<div class="container">
<h1 class="site-title">
<a href="<?php echo esc_url( home_url( '/' ) ); ?>">
<?php bloginfo( 'name' ); ?>
</a>
</h1>
<nav class="main-navigation">
<?php
wp_nav_menu( array(
'theme_location' => 'main-menu', // functions.phpで登録したID
'container' => false,
'menu_class' => 'nav-list',
) );
?>
</nav>
</div>
</header>
2. 絶対に外せない「3つの必須テンプレートタグ」
自作テーマでこれを忘れると、プラグインが動かなかったり、管理画面のバーが表示されなかったりします。
- language_attributes():<html lang=”ja”>などを自動出力します。管理画面で設定した言語に合わせて動的に変わります。
- wp_head():最も重要です。 </head>タグの直前に記述します。これがないと、functions.phpで読み込んだCSSや、SEOプラグイン、アクセス解析コードなどが一切出力されません。
- body_class():<body class=”home blog…”>のように、ページの種類に応じたCSSクラスを自動付与します。ページごとにデザインを変えたい時に非常に便利です。
3. サイトタイトルとリンクの書き方
ロゴやサイト名には、トップページへのリンクを貼るのが一般的です。
esc_url( home_url( '/' ) ): サイトのトップページURLを取得します。セキュリティのためにesc_urlで囲むのがWordPressの作法です。bloginfo( 'name' ): 設定画面で入力した「サイトのタイトル」を表示します。
4. メニューを動的に表示する(wp_nav_menu)
前回functions.phpで登録したメニューを、ここで呼び出します。
PHP
wp_nav_menu( array(
'theme_location' => 'main-menu', // 紐付けたいメニュー位置のID
'menu_class' => 'header-nav', // <ul>に付与するCSSクラス名
) );
このように書くことで、管理画面の「外観 > メニュー」で作った項目が、自動的にHTML(<ul>や<li>)として出力されます。
header.php を作る際の注意点
- wp_body_open() を忘れずに:WordPress 5.2から追加されたタグです。<body>の直後に記述します。計測タグ(Google Tag Managerなど)を挿入するプラグインなどがここを利用します。
- 固定のCSSリンクは書かない:<link rel=”stylesheet” href=”…”>を直接書きたくなりますが、それは前回解説した通りfunctions.phpから読み込むのがWordPressのルールです。
次のステップ:他のファイルとの連携
header.phpができたら、次はindex.phpやsingle.phpなどの一番上で呼び出してみましょう。
PHP
<?php get_header(); ?>
<?php get_footer(); ?>
この一行(get_header();)を書くだけで、今回作成したheader.phpの内容が読み込まれます。



