【WordPress】ページごとにヘッダーやフッターの内容を変更する方法

トップページと下層ページでヘッダーやフッターを変えたいけどどうすればいいの？

Webサイトを作成する際に、トップページと下層ページで異なるヘッダーやフッターを実装したい場面が出てくることがあると思います。
今回は、WordPressでページごとにヘッダーやフッターを変更する方法について解説していきます！

それでは早速、WordPressでページごとにヘッダーやフッターを変更する方法についてみていきましょう！

実装手順

手順としては、

1. テンプレートファイル（「header.php」、「footer.php」）の作成
2. インクルードタグ（<?php get_header(); ?>、<?php get_footer(); ?>）を使用してファイルの読み込み

と、簡単に実装することができます。

1. テンプレートファイル（「header.php」、「footer.php」）の作成

まずは、ヘッダーやフッターに使用する、header.phpやfooter.phpファイルを作成します。

このファイルとは別に、下層ページなど別のページで読み込ませたいヘッダーやフッターのファイルを作成し、ファイル名を下記のようにします。

headerの後にハイフン(-)を使用し任意の英数字をつけてください。
header-   .php
(例：header-page.php)

フッターも同様にファイル名を下記のようにします。

footerの後にハイフン(-)を使用し任意の英数字をつけてください。
footer-   .php
(例：footer-page.php)

これで、トップページとは別のヘッダーやフッターが作成できました。

この作成したファイルを表示させたいページに読み込ませるコードを記述していきます。

2. インクルードタグを使用して呼び出し

WordPressには下記表に記載されているインクルードタグと呼ばれるテンプレートを呼び出すための関数があります。

このインクルードタグを用いて、先ほど作成した「header.php」や「footer.php」のようなテンプレートファイルを読み込みます。

トップページにheader.phpとfooter.phpを読み込ませる場合

<?php get_header(); ?>
<main>
//コンテンツ
</main>
<?php get_footer(); ?>

下層ページ用の「header-page.php」と「footer-page.php」を読み込ませる場合

<?php get_header('page'); ?>
<main>
//コンテンツ
</main>
<?php get_footer('page'); ?>

作成した「header-page.php」と「footer-page.php」を呼び出すには、
<?php get_header(‘page’); ?>のように、括弧()の中にハイフン(-)の後ろの任意の文字列をシングルクオート「’」で囲い、記述します。

今回は「header-page.php」と「footer-page.php」を用いて解説しましたが、
「header-   .php」と「<?php get_header(‘   ‘); ?>」の   が共通の文字列であれば呼び出すことができます。

また、ヘッダーやフッターのみならず他のインクルードタグも同様に呼び出すことができますので、必要な実装状況に合わせて使用してください。

まとめ

今回は、WordPressでページごとにヘッダーやフッターを変更する方法について解説してきました。

テンプレートファイルやインクルードタグを使うことで、各ページでヘッダーやフッターなどのレイアウトを自由に変更することができます。

テンプレートタグや条件分岐タグなどWordPressでよく使うコードについても今後紹介していこうと思います。