テンプレートパーツとは

１つのページを”部品”に分ける

一般的なサイト構造は、ヘッダー、投稿記事、サイドメニュー、フッターなどから構成されています。

WordPressでは、通常、それぞれの部分に対応したPHPファイルを作成します。これらのPHPファイルは”部品”のような役割を果たすので、テンプレートパーツと呼ばれます。

 

インクルードタグで読み込み

テンプレートパーツは、「インクルードタグ」で読み込み、サイトに反映させることが出来ます。インクルードタグはWordPressで用意されている関数です。下図は、テンプレートindex.phpに書いた各種インクルードタグで、テンプレートパーツを読み込んでいる様子を示しています。

 

ファイルを分割する理由

異なるテンプレート間でパーツを共用できる

テンプレートパーツ化すると、異なるテンプレート（トップページ用、カテゴリ表示用、固定ページ用・・・etc）間でパーツを共用できます。

 

パーツ化するとメンテナンス性が向上する

テンプレートパーツを利用することで、サイトのメンテナンスが容易になります。例えば、上図のサイトでメニューバーを変更する場合は、header.phpのファイル１つを修正するだけで済みます。

 

テンプレートパーツを作成する

1. テンプレートファイルを分割して、パーツファイルを作成する

index.phpファイルを分割して、４つのPHPファイルを新規作成します。

• header.php new!
• content.php new!
• sidebar.php new!
• footer.php new!
• index.php

header.php

今回は、index.phpファイルの先頭から<div id=”main”>タグまでをヘッダー部品とします。

content.php

ループ内の、投稿記事を表示する部分を抜き出します。

sidebar.php

サイドメニューの部分を切り出して、sidebar.phpとします。

footer.php

div#mainの終了タグから、元のHTMLファイルの最後までをfooter.phpとします。div#main開始タグまでをheader.phpに入れたので、それに対応する形にしています。

index.php（仮）

元のHTMLファイルのうち、以上の４つのパーツが切り取られた残りを、とりあえずindex.phpとしておきます。既に大部分が切り取られていましたね。

<!-- header.phpへ移動した -->
<div id="content">
<?php if(have_posts()): while(have_posts()): the_post(); ?>
 <!-- content.phpへ移動した -->
<?php endwhile; endif; ?>
</div>
<!-- sidebar.phpへ移動した -->
<!-- footer.phpへ移動した -->

2. index.phpにインクルードタグを挿入する

パーツとして切り取られた場所に、インクルードタグを書きます。ヘッダー、サイドバー、フッターに関しては専用のWP関数が用意されています。content.phpは、パーツファイルを読み込むための汎用のWP関数を使います。

index.php

get_template_part()

テンプレートパーツを読み込むWordPress関数。引数に、インクルードするファイル名を指定する。拡張子（.php）は省略して指定する。

ファイル最後のPHPブロック終了タグは省略OK

PHPブロックの終了タグがファイルの最後にくる場合は、省略できます。

 

まとめ

２ステップで完了します。手順はシンプルですね。

1. index.phpを分割して、header.php、content.php、sidebar.php、footer.phpにカット＆ペースト。
2. index.phpにインクルードタグを挿入する。

 

関連記事

第４回 テンプレートファイル分割＆インクルードタグの使い方

プレゼン形式で、同様の内容を解説しています。

 

「index.phpをカスタマイズする」の記事