このレッスンでは、header.phpやsidebar.php、footer.phpといった多くのページで共通して利用される部分をテンプレートファイルとしてまとめて利用する方法を解説します。
動画
レッスンの準備
このレッスンでは、上記リポジトリのwp-lesson-14というディレクトリにあるファイルを使って学習を進めていきます。
WordPressのルートディレクトリにあるwp-contentの中のthemesにwp-lesson-14ディレクトリを設置しましょう。
共通部分をテンプレートファイルとしてまとめる
ウェブサイトのそれぞれの部分をテンプレートファイルにまとめることができます。代表的なテンプレートは以下のようなものがあります。
- header.php
- sidebar.php
- footer.php
これらを読み込む方法として、
get_header()get_sidebar()get_footer()
と記述することができます。
index.phpを分解してテンプレートファイル化する
index.phpを開きます。
まず、ここではindex.phpを、
- ヘッダー部分(
header.php) - サイドバー部分(
sidebar.php) - フッター部分(
footer.php) - コンテンツ部分(
index.php)
に分けていきます。header.php sidebar.php footer.phpの空ファイルをあらかじめ作っておきましょう。
header.php
index.phpの冒頭から35行目あたりの<!-- end NAVIGATION -->というコメントあたりまでを、header.phpに移動させます。そして、もとの部分にget_header()を記述します。
sidebar.php
<aside class="l-sidebar">〜</aside>部分をsidebar.phpに移動させます。そして、その部分にget_sidebar()を記述します。
footer.php
<footer class="l-site-footer p-site-footer">〜</html>部分をfooter.phpに移動させます。そして、その部分にget_footer()を記述します。
Show Current Templateを活用する
Show Current Template プラグインを利用し、テンプレートが読み込まれているかどうかを確認しながら進めてみましょう。

