【WordPress】テンプレートパーツの種類と使い方


WordPressのテーマに必要なテンプレートファイルですが、1つのファイルにすべてを書き込むと、すごい記述量になってしまいます。

このままだと、メンテナンス性が低く、Webサイトの管理が大変に。

そこで、Webサイト内における、各ページのヘッダーやフッターなど共通している箇所が多いことを利用して、共通部分をそれぞれファイルにまとめて分離させるという考えが生まれます

このテンプレートファイルの共通部分だけをまとめたファイルが『テンプレートパーツ』。

以下で、テンプレートパーツの種類と使い方について、ご説明します。

テンプレートパーツを使ったサイト構造

Webサイトは、通常、次の図のように、いくつかのパートに分かれます。

部分名 内容
ヘッダー ページの先頭部分。ページタイトルやナビゲーションなどを配置。
コンテンツ ページの中心となる部分。WordPressループを設置し、本文を配置。
サイドバー コンテンツの左右部分。関連記事、新着記事やカテゴリー、広告等を配置。
フッター ページの末尾部分。コピーライト(著作権)やカテゴリ一覧などを配置。

ヘッダーやサイドバー、フッターなどは、ページ毎に変更することがあまりありません。サイト閲覧者のユーザビリティにもつながるためです。

だからこそ、分けて一括管理することに意味があります。

テンプレートファイルの利点

テンプレートパーツの利点は、大きく考えて2点

テンプレートパーツの利点
  • テンプレートファイルの記述が減る
  • 一括更新が可能

どちらも、メンテナンス性が向上し、Webサイト管理が簡単になります。

スポンサーリンク

テンプレートファイルの記述が減る

テンプレートファイルに書き込む内容は、<html>タグから始まり、<head>タグのような表示されない記述や<body>タグなどの表示に関わる記述など、多数あります。

テンプレートパーツを利用することで、テンプレートファイルに書き込むのは、メインとなる「コンテンツ部分」とテンプレートパーツを呼び出すコードだけに。

テンプレートファイルの改良や変更・更生において、メインコンテンツに集中できます。

一括更新が可能

ヘッダー、フッター、サイドバーなどのパーツ(部分)を共通化することで、一括更新が可能になり、結果、Webサイトのメンテナンス性が向上♪

header.phpを利用しない場合を考えてみてください。

たとえば、<head>タグや<header>タグの内容を変更することになった場合、テンプレートの数だけ、変更をする手間がかかってしまいます。

変更に時間がかかるだけでなく、記述ミスの可能性も上がります

僕は、頻繁にデザインを変更するため、これらのテンプレートパーツの重要性を痛感します。

もしテンプレートパーツがなければ、変更が邪魔くさくなり、おそらくデザイン変更をする回数が減るでしょう。良いウェブデザインを思いついたら、即変更が理想

Webサイトの改良は、サイト製作者の楽しみのひとつですよね。

テンプレートパーツの問題点

以下で説明しますが、テンプレートパーツを使うには、呼び出しが必要になります。

Webサイトは、呼び出しが増えれば増えるほど、表示速度が遅いサイトになってしまいます

しかし、Webサイトを運営するうえで、メンテナンス性も非常に重要であるため、速度を犠牲にするだけの価値はあります。

ちなみに、速度が遅くなるといっても、微々たるものですが。

テンプレートの共通部分を出力するテンプレートパーツ

共通部分を出力する「テンプレートパーツ」には、以下のものがあります。

ファイル名 内容
header.php ヘッダー部分を出力
footer.php フッター部分を出力
sidebar.php サイドバー部分を出力
searchform.php 検索フォームを出力
comments.php コメント一覧とコメント入力フォームを出力

これらのファイル名で、テーマ内にPHPファイルを作成します。

利用上のイメージとしては、以下のようになります。

ヘッダーをheader.phpに、サイドバーをsidebar.phpに、フッターをfooter.phpに書き込むことで、サイト構造はシンプルに。

上記の3つ以外にも、検索フォーム用のsearchform.php、コメント用のcomments.phpなどもテンプレートパーツとして利用できます。

どこで区切ってもOK

基本、HTMLのどこで区切ってもOK

たとえば、header.phpの中にナビゲーションを入れてもいいし、入れなくても大丈夫。sidebar.phpの中に、記事下の関連記事などを記述してもOK。

さらにいうと、sidebar.phpを省略して、サイドバーの内容をfooter.phpに記述し、1つにまとめることも可能

しかし、適当な分け方をすると、後々混乱します。

なので、以下のようにすることをオススメ。

記述内容の例
header.php <html><head>〜<?php wp_head(); ?></head><body><header>〜</header>+グローバルナビゲーション
sidebar.php <div id=”sidebar”>〜</div>
footer.php <footer>〜</footer><?php wp_footer(); ?></body></html>

テンプレートファイルは、メインコンテンツだけに集中できる環境に

スポンサーリンク

テンプレートファイルの呼び出し方法

上記で作成した「テンプレートパーツ」をテーマのテンプレートファイル上で呼び出す方法は、以下のコードを記述するだけ。

呼び出し方

single.phpやpage.phpなどのテンプレートファイルの中に、次の右側のコードを記述するだけ。

テンプレートパーツ名 呼出し方
header.php <?php get_header(); ?>
footer.php <?php get_footer(); ?>
sidebar.php <?php get_sidebar(); ?>
searchform.php <?php get_search_form(); ?>
comments.php <?php comments_template(); ?>

実際のテンプレートファイル内の記述は、次のようになります。


<?php get_header(); ?>

コンテンツ(WordPressループや表示させたい内容を記述)

<?php get_sidebar(); ?>
<?php get_footer(); ?>

footer.phpの内容の中に、sidebar.phpの内容を書き込み、footer.phpのみで済ますことも、当然可能です。

ですが、Webサイト・デザインの多様性を考えると、sidebar.phpとfooter.phpをそれぞれ作成することをオススメします。

複数のテンプレートパーツも可能

さらに、header.php、footer.php、sidebar.phpに関しては、複数のテンプレートパーツを作成することができます。

トップページ、固定ページ、投稿ページなどで、使い分けたい場合に役立ちます。

テンプレート・ファイルの作り方

header.phpを例にあげると、次のようになります。

header-○○.phpのように、headerのあとにハイフンと任意のアルファベットを付けるだけ。

たとえば、header-top.php、header-single.php、header-page.phpなど。

呼び出し方

次に、テンプレート内で、テンプレートパーツを呼出す方法を、ご説明します。

呼出し方

通常は、以下の記述で、header.phpを呼出します。

<?php get_header(); ?>

header-○○.phpの場合は、上記のカッコ内に’○○’が追加され、次のようになります。

<?php get_header('○○'); ?>

たとえば、header-top.phpの場合は、次のようになります。

<?php get_header('top'); ?>
スポンサーリンク
ページ先頭へ