文中の説明画像をクリックすると拡大します。
WordPressのテンプレートタグって何?
WordPressで作られたWebサイトは、「テーマ」を切り替えることでデザインを変更できます。WordPressのテーマとは、複数のテンプレートファイルから構成されている、Webサイトのデザインや機能のひな形のことです。
テンプレートタグとは、WordPressの本体やプラグインによって用意されている、ブログの見た目をカスタマイズするための専用のタグのことです。
「タグ」とは、簡単に言うと「印」のようなものです。
HTMLタグでWebサイトを作るように、WordPressをカスタマイズするためには、テンプレートファイルにテンプレートタグを記述することが必要です。
テンプレートタグの実体は、PHPというプログラミング言語で作られている関数です。WordPress自体がPHPで開発されているため、テンプレートタグも、PHPの関数として提供されています。
WordPressに用意されているテンプレートタグの一覧が、WordPress Codex日本語版に記載されています。
【参考】テンプレートタグ
今回はテンプレートタグの中でも、Webサイトの見た目に関するカスタマイズでよく使われるものを紹介します。
WordPressのテーマって何だっけ?という方はこちらをご覧ください。
テンプレートファイルって何だっけ?という方はこちらをご覧ください。
投稿や固定ページのタイトルを表示する「the_title」タグ
the_titleタグは、現在表示しているページのタイトルを表示するテンプレートタグです。
the_titleタグは、WordPressのループの中で使う必要があります。WordPressのループに関しては以下の記事をご覧ください。
また、the_titleタグを呼び出す時に、タイトル前後に挿入する文字列をカスタマイズできます。具体的なPHPコードを紹介します。
【PHP】
<?php the_title( '<h1>', '</h1>' ); ?>
上記の例では投稿のタイトルの前後をh1タグで囲っています。これは以下の書き方で書き換えることが可能です。
【PHP】
<h1> <?php the_title(); ?> </h1>
the_titleタグのパラメータ(処理結果に影響を与える外から入ってくる値)として、h1タグを渡すのが前者の方法で、後者ではthe_titleタグの前後を直接h1タグで囲っています。
結果的には同じになりますが、方法はいくつかあるということです。
PHPに限らず、プログラミングでは、同じ結果を得るために、いくつかの別の方法が用意されていることがあります。
また、the_titleタグを使う時は、echo文を使わなくてもthe_titleタグだけでブラウザ上に表示されることがあげられます。
つまり、以下のようなechoを使った書き方はNGです。
【PHP(NGの例)】
<?php echo the_title(); ?>
NGの例では、the_titleタグに対してecho文を使っています。環境によっては動作することもあるのですが、これは基本的にNGです。
the_titleタグは、これを記述するだけでブラウザ上に表示してくれます。
一方、the_titleタグではなく、get_the_title関数を使ってタイトルを表示するには、echo文を使う必要があります。
【PHP(OKの例 get_the_title関数を使用)】
<?php echo get_the_title(); ?>
ここまでの解説を整理すると、以下のようになります。
【 the_title(); 】=【 echo get_the_title(); 】
このへんの事情は、WordPressのテーマ開発においてとても重要でややこしい部分なので、しっかりと押さえておく必要があります
WordPressのテンプレートタグの中で、「the_XXXX」のように「the」で始まっているタグは、echo文がなくてもブラウザ上に表示までしてくれる、と覚えておきましょう。
その他、the_titleタグの説明は、リファレンスを参考にしてください。
【参考】the_title
Webサイトの各種情報を表示する「bloginfo」タグ
bloginfoタグは、Webサイトの主要の情報を表示させるタグです。パラメータに取得したい情報を渡してやることで、各種情報を取得できます。
【PHP】
<?php bloginfo('name'); // Webサイトのタイトルを表示 bloginfo('description'); // Webサイトの概要を表示 bloginfo('version'); // WebサイトのWordPressのバージョンを表示 ?>
上記のようにパラメータとして「name」「description」「version」などを渡すことで、パラメータに対応したWebサイトの各種情報を取得できます。
bloginfoタグも、the_titleタグと同じようにecho文なしでブラウザへ表示してくれます。
また、bloginfoタグ自体は現在でも使えますが、一部のパラメータの使用は非推奨になっているものがあります。
【PHP bloginfoタグの非推奨パラメータと代替の関数】
<?php bloginfo('stylesheet_url'); // echo get_stylesheet_uri() bloginfo('stylesheet_directory'); // echo get_stylesheet_directory_uri(); bloginfo('template_url'); // echo get_template_directory_uri(); bloginfo('template_directory'); // echo get_template_directory_uri(); bloginfo('url'); // echo home_url(); bloginfo('wpurl'); // echo site_url(); bloginfo('home'); // echo get_bloginfo('url'); bloginfo('siteurl'); // echo get_bloginfo('url'); ?>
各行のPHPのコメント内が、それぞれのbloginfoタグの代替される関数です。
bloginfoタグを使用する際には、非推奨のパラメータを使う事は避けて、echo文から始まる代替の関数を使用してテンプレートファイルに記述しましょう。
パーツ化したテンプレートファイルを読み込むためのタグ
WordPressのテンプレートファイルでは、複数のファイル内で共通の部分をパーツ化して管理できます。
例えば、Webサイトのヘッダーとフッターの部分をパーツ化して、home.phpやsingle.phpにおいて読み込むことができます。
これは、基本的なテンプレート編集で良く使われるので、馴染みがあるかもしれません。
header.phpを読み込む「get_header」タグ
テーマ内にあるheader.phpを読み込むテンプレートタグが、get_headerタグです。
具体的な使い方は以下の通りです。
【PHP】
<?php get_header(); ?>
footer.phpを読み込む「get_footer」タグ
テーマ内にあるfooter.phpを読み込むテンプレートタグが、get_footerタグです。
具体的な使い方は以下の通りです。
【PHP】
<?php get_footer(); ?>
sidebar.phpを読み込む「get_sidebar」タグ
テーマ内にあるsidebar.phpを読み込むテンプレートタグが、get_sidebarタグです。
具体的な使い方は以下の通りです。
【PHP】
<?php get_sidebar(); ?>
任意のテンプレートパーツを読み込む「get_template_part」タグ
ヘッダー、フッター、サイドバー以外のパーツを読み込むタグが、get_template_partタグです。複数のテンプレートファイルの中で、共通の部分をパーツ化して使いまわすときに使います。
具体的な使い方は以下の通りです。
【PHP】
<?php get_template_part('loop'); ?>
このように記述すると、loop.phpという名前のパーツがテンプレートファイル内に読み込まれます。
WordPressのテーマを開発するときに、header.phpやfooter.phpのようにパーツを分けて管理することで、同じコードを繰り返しの記述を減らし、メンテナンスがしやすくなります。
オリジナルのテーマをゼロから開発する時には、このことをよく頭に入れておき、効率良くテーマ開発をしましょう。
まとめ
- WordPressのテンプレートタグとは、ブログのデータをブラウザに表示させるための専用のタグ。
- テンプレートタグの実体は、PHPで記述されているプログラムの関数。
- テンプレートをパーツ化することで、効率良くテーマ開発ができる。