ページテンプレートの使用

ページテンプレートは、あなたのサイトの動的コンテンツをページ上に表示します。例えば、投稿、ニュース更新、カレンダーイベント、メディアファイルなどです。あなたは、ホームページを他の部分とはかなり異なる特定の方法で見せたいと決めるかもしれません。または、ページの一部に投稿へのリンクがあるフィーチャー画像を表示し、他の場所に最新の投稿のリストを持ち、カスタムナビゲーションを使用したいかもしれません。これらのことを達成するためにページテンプレートを使用できます。

このセクションでは、ユーザーが管理画面を通じて選択できるページテンプレートを構築する方法を示します。

例えば、次のようなページテンプレートを構築できます:

  • フル幅、1カラム
  • 右側にサイドバーのある2カラム
  • 左側にサイドバーのある2カラム
  • 3カラム

テンプレート階層内のページテンプレート

ユーザーがあなたのウェブサイトを閲覧すると、WordPressはそのページをレンダリングするためにどのテンプレートを使用するかを選択します。前に学んだように、テンプレート階層では、WordPressは次の順序でテンプレートファイルを探します:

  • 1. ページテンプレート —ページにカスタムテンプレートが割り当てられている場合、WordPressはそのファイルを探し、見つかった場合はそれを使用します。
  • 2. page-{slug}.phpカスタムテンプレートが割り当てられていない場合、WordPressはページのスラッグを含む専門のテンプレートを探して使用します。
  • 3. page-{id}.phpページのスラッグを含む専門のテンプレートが見つからない場合、WordPressはページのIDで名付けられた専門のテンプレートを探して使用します。
  • 4. page.phpページのIDを含む専門のテンプレートが見つからない場合、WordPressはテーマのデフォルトのページテンプレートを探して使用します。
  • 5. singular.php page.php が見つからない場合、WordPressは単一の投稿に使用されるテーマのテンプレートを探して使用します。
  • 6. index.php特定のページテンプレートが割り当てられていないか見つからない場合、WordPressはテーマのインデックスファイルを使用してページをレンダリングします。

また、WordPressで定義されたテンプレートpaged.phpもあります。これはページの投稿タイプには使用されず、複数のアーカイブページを表示するために使用されます。

ページテンプレートの目的とユーザーコントロール

テーマのカスタムページテンプレートを作成する予定がある場合、進む前にいくつかのことを決める必要があります:

  • ページテンプレートが特定のページ用か、任意のページ用か;
  • テンプレートに対してどのようなユーザーコントロールを提供したいか。

テンプレート名があるすべてのページテンプレートは、ユーザーがページを作成または編集する際に選択できます。利用可能なテンプレートのリストは、ページ > 新規追加 > 属性 > テンプレートで見つけることができます。したがって、WordPressユーザーはテンプレート名のある任意のページテンプレートを選択でき、これはあなたの意図ではないかもしれません。

例えば、「About」ページ用の特定のテンプレートを持ちたい場合、そのページテンプレートを「About Template」と名付けるのは適切ではないかもしれません。なぜなら、それはすべてのページにグローバルに利用可能になるからです(つまり、ユーザーはそれを任意のページに適用できる)。代わりに、単一使用のテンプレートを作成し、WordPressはユーザーが「About」ページを訪れるたびに適切なテンプレートでページをレンダリングします。

逆に、多くのテーマはページにいくつのカラムがあるかを選択する機能を含んでいます。これらのオプションのそれぞれは、グローバルに利用可能なページテンプレートです。このグローバルオプションをWordPressユーザーに提供するには、各オプションのためにページテンプレートを作成し、それぞれにテンプレート名を付ける必要があります。

テンプレートがグローバル使用か単一使用かを決定するのは、ファイルの名前付けと特定のコメントがあるかどうかによって達成されます。

時には、単一使用のケースに見えても、テンプレートをグローバルに利用可能にすることが適切です。リリース用のテーマを作成していると、ユーザーがページに何と名付けるかを予測するのは難しいことがあります。ポートフォリオページは素晴らしい例です。なぜなら、すべてのWordPressユーザーが同じ名前でポートフォリオを名付けるわけではなく、同じページIDを持つわけではありませんが、それでもそのテンプレートを使用したいかもしれません。

ページテンプレートのファイル整理

テーマファイルの整理についてOrganizing Theme Filesで説明したように、WordPressはサブフォルダpage-templatesを認識します。したがって、グローバルページテンプレートをこのフォルダに保存して整理するのは良いアイデアです。

専門のページテンプレートファイル(1回限りの使用のために作成されたもの)は、サブフォルダに置くことはできません。また、子テーマを使用している場合、親テーマのフォルダにも置くことはできません。

グローバル使用のためのカスタムページテンプレートの作成

時には、任意のページまたは複数のページでグローバルに使用できるテンプレートが必要です。一部の開発者は、page_two-columns.phpのようにファイル名のプレフィックスでテンプレートをグループ化します。

重要! page-をプレフィックスとして使用しないでください。WordPressはそのファイルを専門のテンプレートとして解釈し、サイトの1つのページにのみ適用されることを意味します。

テーマファイルの命名規則や使用できないファイル名については、予約されたテーマファイル名を参照してください。

新しいページテンプレートを作成するための迅速で安全な方法は、page.phpのコピーを作成し、新しいファイルに異なるファイル名を付けることです。これにより、他のページのHTML構造から始めることができ、新しいファイルを必要に応じて編集できます。

グローバルテンプレートを作成するには、ファイルの先頭にテンプレート名を示すPHPのオープニングコメントを書きます。

  1. <?php /* Template Name: Example Template */ ?>

テンプレートが何をするかを説明する名前を選ぶのが良いアイデアです。なぜなら、その名前はユーザーがページを編集する際にWordPressユーザーに表示されるからです。例えば、テンプレートをHomepage、Blog、またはPortfolioと名付けることができます。

TwentyFourteenテーマのこの例では、Full Width Pageというページテンプレートを作成します:

  1. <?php
  2. /**
  3. * Template Name: Full Width Page
  4. *
  5. * @package WordPress
  6. * @subpackage Twenty_Fourteen
  7. * @since Twenty Fourteen 1.0
  8. */

basics-page-templates-03

ファイルをテーマのフォルダ(例:page-templates)にアップロードしたら、管理ダッシュボードのページ > 編集画面に移動します。

右側の属性の下にテンプレートが表示されます。ここでユーザーはグローバルページテンプレートにアクセスできます。

選択リストの最大幅は250pxなので、長い名前は切り取られることがあります。

特定のページ用のカスタムページテンプレートの作成

前述のテンプレート階層ページで述べたように、特定のページ用のテンプレートを作成できます。特定のページ用のテンプレートを作成するには、既存のpage.phpファイルをコピーし、ページのスラッグまたはIDで名前を変更します:

  • 1. page-{slug}.php
  • 2. page-{ID}.php

例えば:あなたのAboutページのスラッグは「about」で、IDは6です。アクティブテーマのフォルダにpage-about.phpまたはpage-6.phpという名前のファイルがある場合、WordPressは自動的にそのファイルを見つけてAboutページをレンダリングします。

使用するためには、専門のページテンプレートはテーマのフォルダに存在する必要があります(つまり、/wp-content/themes/my-theme-name/)。

特定の投稿タイプのためのページテンプレートの作成

デフォルトでは、カスタムページテンプレートは「ページ」投稿タイプに利用可能です。

特定の投稿タイプ用のページテンプレートを作成するには、テンプレート名の下にそのテンプレートがサポートする投稿タイプを追加します。

例:

  1. <?php
  2. /*
  3. Template Name: Full-width layout
  4. Template Post Type: post, page, event
  5. */
  6. // Page code here...

「ページ」投稿タイプ以外の投稿タイプにページテンプレートを追加するこの機能は、WordPress 4.7以降でのみサポートされています。

少なくとも1つのテンプレートが投稿タイプに存在する場合、「投稿属性」メタボックスはバックエンドに表示され、「ページ属性」や他の何かのために投稿タイプサポートを追加する必要はありません。「投稿属性」ラベルは、投稿タイプを登録する際に「attributes」ラベルを使用してカスタマイズできます。

後方互換性:

投稿タイプテンプレートのサポートを持つテーマを公開リリースしたいとします。WordPress 4.7以前のバージョンでは、Template Post Typeヘッダーを無視し、通常の投稿にのみ機能するにもかかわらず、ページテンプレートのリストにテンプレートを表示します。それを防ぐために、theme_page_templatesフィルターにフックしてリストから除外できます。以下はその例です:

  1. /**
  2. * Hides the custom post template for pages on WordPress 4.6 and older
  3. *
  4. * @param array $post_templates Array of page templates. Keys are filenames, values are translated names.
  5. * @return array Filtered array of page templates.
  6. */
  7. function makewp_exclude_page_templates( $post_templates ) {
  8. if ( version_compare( $GLOBALS['wp_version'], '4.7', '&lt;' ) ) {
  9. unset( $post_templates['templates/my-full-width-post-template.php'] );
  10. }
  11. return $post_templates;
  12. }
  13. add_filter( 'theme_page_templates', 'makewp_exclude_page_templates' );

これにより、WordPress 4.7以降でカスタム投稿タイプテンプレートをサポートしながら、完全な後方互換性を維持できます。

themepage_templatesは実際には動的なtheme{$post_type}_templatesフィルターです。フック名の動的部分$post_typeは、テンプレートがサポートする投稿タイプを指します。例えば、theme_product_templatesにフックして、製品投稿タイプのテンプレートリストをフィルタリングできます。

ページテンプレートでの条件タグの使用

テーマのpage.phpファイルで条件タグを使用して、より小さなページ固有の変更を行うことができます。例えば、以下の例のコードは、フロントページ用にheader-home.phpファイルを読み込みますが、Aboutページ用には別のファイル(header-about.php)を読み込み、他のすべてのページにはデフォルトのheader.phpを適用します。

  1. if ( is_front_page() ) :
  2. get_header( 'home' );
  3. elseif ( is_page( 'About' ) ) :
  4. get_header( 'about' );
  5. else:
  6. get_header();
  7. endif;

条件タグについての詳細はこちらで学べます。

ページテンプレートの識別

テンプレートがbody_class()関数を使用している場合、WordPressは投稿タイプクラス名(page)、ページのID(page-id-{ID})、および使用されたページテンプレートのためにbodyタグにクラスを印刷します。デフォルトのpage.phpの場合、生成されるクラス名はpage-template-defaultです:

  1. <body class="page page-id-6 page-template-default">

専門のテンプレート(page-{slug}.phpまたはpage-{ID}.php)も独自のボディクラスではなくpage-template-defaultクラスを取得します。

カスタムページテンプレートを使用する場合、クラスpage-templateが印刷され、特定のテンプレートを示すクラスが付加されます。例えば、カスタムページテンプレートファイルが次のように名付けられている場合:

  1. <?php
  2. /* Template Name: My Custom Page */
  3. ?>

生成されるHTMLは次のようになります:

  1. <body class="page page-id-6 page-template page-template-my-custom-page-php">

page-template-my-custom-page-phpクラスがbodyタグに適用されていることに注意してください。

ページテンプレート関数

これらの組み込みWordPress関数とメソッドは、ページテンプレートを操作するのに役立ちます:

  • get_page_template()は、ページをレンダリングするために使用されるページテンプレートのパスを返します。
  • wp_get_theme()->get_page_templates()は、現在アクティブなテーマに利用可能なすべてのカスタムページテンプレートを返します(get_page_templates()WP_Themeクラスのメソッドです)。
  • is_page_template()は、ページをレンダリングするためにカスタムページテンプレートが使用されたかどうかに応じてtrueまたはfalseを返します。
  • get_page_template_slug()は、カスタムフィールド_wp_page_templateの値を返します(値が空または「デフォルト」の場合はnull)。ページにカスタムテンプレートが割り当てられている場合、そのテンプレートのファイル名は、'_wp_page_template'という名前のカスタムフィールドの値として保存されます(wp_postmetaデータベーステーブル内)。(アンダースコアで始まるカスタムフィールドは、編集画面のカスタムフィールドモジュールに表示されません。)