テンプレートとは、
テンプレートは、htmlを使って、WEBページのレイアウト(構造）を記述したファイルです。
WordPressの場合、サイトのタイトル、投稿タイトル、投稿コンテンツ等を表示するために、テンプレートタグを使って、htmlの中に必要な情報を埋め込みます。
例えば、過去十年以上WordPressのテンプレートは以下のような記述が行われてきました。
if ( have_posts() ) {
// Load posts loop.
while ( have_posts() ) {
the_post();
<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
<header class="entry-header">
<?php
the_title( sprintf( '<h2 class="entry-title default-max-width"><a href="%s" rel="bookmark">', esc_url( get_permalink() ) ), '</a></h2>' );
twenty_twenty_one_post_thumbnail();
?>
</header><!-- .entry-header -->
<div class="entry-content">
<?php the_content();?>
</div><!-- .entry-content -->
<footer class="entry-footer default-max-width">
<?php twenty_twenty_one_entry_meta_footer(); ?>
</footer><!-- .entry-footer -->
</article><!-- #post-${ID} -->
}
}<と>で囲まれたのがHTMLです。<?phpと?>で囲まれた部分が、テンプレートタグで、テンプレートタグは、PHPで記述します。
この<?phpと?>で囲まれた部分で、WordPressの情報をやり取りしています。
WordPress 5.0から、このPHPで記述したやりかただけでなく、新しい記法が追加されました。
<!-- wp:group {"tagName":"main"} -->
<main class="wp-block-group">
<!-- wp:query {"queryId":1,"query":{"perPage":"10","pages":"100","offset":0,"postType":"post","categoryIds":[],"tagIds":[],"order":"desc","orderBy":"date","author":"","search":"","sticky":"","inherit":true}} -->
<!-- wp:query-loop -->
<!-- wp:group {"tagName":"article", "layout":{"inherit":true}} -->
<article class="wp-block-group">
<!-- wp:group {"tagName":"header", "layout":{"inherit":true}} -->
<header class="wp-block-group">
<!-- wp:post-title {"isLink":true} /-->
</header>
<!-- /wp:group -->
<!-- wp:group {"layout":{"inherit":true}} -->
<div class="wp-block-group">
<!-- wp:post-content {"layout":{"inherit":true}} /-->
</div>
<!-- /wp:group -->
</article>
<!-- /wp:group -->
<!-- /wp:query-loop -->
<!-- /wp:query -->
</main>
<!-- /wp:group -->この新しい、テンプレート記法は、PHPを使用せず、html要素とコメントで記述されるものです。
この新しいテンプレート形式で、出来るようになったこと。
テンプレートをHTMLだけで記述できるようになったことで、カスタム投稿タイプにテンプレートを保存できるようになりました。
これにより、WordPress 5.8で、テンプレートエディタでカスタムテンプレートを新規に作成する機能が追加されたり、サイトエディタ機能で、サイト全体の設定を保存したり、変更できるようになりました。
ただ、これまでになかった機能なので、ユーザーがテンプレートを使うべき場面を適切に判断したり、デフォルトテンプレートを編集した場合に、現在のデフォルトテンプレートがどのテンプレートなのか影響範囲を正しく理解するには、簡単とはいえません。
この新しいテンプレート形式で出来にくくなったこと
PHP テンプレートには、条件分岐タグがありましたが、現在のところ条件分岐タグに相当するものはありません。
PHPテンプレートには、フィルターやアクションを記述することができましたが、現在のところ準備されていませんので、コアのフィルターやアクションに置き換える必要があるかもしれません。
テンプレート階層で定義されているテンプレートファイルの命名規則は、プライマリーテンプレート、セカンダリーテンプレート、バリアブルテンプレートなどが定義されていますが、この新しいテンプレートは、バリアブルテンプレート等は対応していないため、phpテンプレートをテーマが混用する必要があるかもしれません。
新しいテンプレート形式のテーマは、どこにあるのか？
フルサイトエディタ対応
WordPress Themes: Full Site Editing Free | WordPress.org
ブロックエディタ対応
WordPress Themes: Block Editor Patterns Free | WordPress.org
いずれにしろ、既存サイトを、最新のテンプレートを使用できるように対応する場合は、現在のテンプレート階層と、新しいテンプレートシステムの違いや動作の仕組みを十分理解することは、重要になりつつあります。
テンプレート階層のおさらい
投稿や、固定ページで使用されるテンプレートは、テンプレートファイルの命名規則があり、特定の投稿IDやURLスラッグなどと組み合わせて、特定の投稿で特別なテンプレートを使用して表示することができるようになっています。
カスタムテンプレート
https://wpdocs.osdn.jp/ページテンプレート
テーマに、以下のようにコメント行を追加したテンプレートを作成しておくと、テーマの投稿編集画面で、テンプレートを選択できるようになります。Template Post Typeを指定しておくことで、投稿、固定ページいずれでも選択できるようになります。
/**
* Template Name: Gallery template
* Template Post Type: post, page
*
*/従来から使用された PHP カスタムテンプレートは、WordPressの外部で、phpファイルを作成して、アップロードする必要があり、作るのが面倒でしたが、
WordPress5.8からは、エディタのメニューから、作成できるようになります。
テンプレートの項目に ‘New’ というリンクが見えますが、このリンクをクリックすると、新しいテンプレートが作成できます。
作成したテンプレートは、外観/テンプレートに保存されます。このテンプレートには、wp-custom-template というプレフィックスのついたテンプレートとして保存されることを覚えておいてください。
テンプレートパートファイル
ヘッダーやフッターなど、テンプレートの一部分を構成する部分で使用されるテンプレートです。
以下の関数を使用することで slug-name.phpファイルを表示します。
slug-name.phpが、存在しない場合は、slug.phpを表示します。
get_template_part( $slug, $name );これ以外にも、ヘッダーやフッターを呼び出す場合に引数を追加することで
get_header('html5');header-html5.phpが存在すれば、そのファイルを表示し、存在しない場合は、header.phpを表示する仕組みがあります。
これらのテンプレートでは、条件分岐タグ – WordPress Codex 日本語版 を使用することで、さらに詳細な表示条件を指定することができるようになっています。
従来から使用された PHP テンプレートは、WordPressの外部で、phpファイルを作成して、アップロードする必要があり、作るのが面倒でしたが、
これらのテンプレートも、外観/テンプレート、外観/テンプレートパート内で、新規に作成することができるようになりました。
作成したテンプレートは、Template Partブロックや、headerブロック、footerブロックなどを使って、呼び出すことができます。
WordPress 5.9 HTMLテンプレート
WordPress 5.9で計画されている新しいテンプレートの仕組みは、これらのもともとあるテンプレートの仕組みに、新たにカスタム投稿タイプにテンプレートを保存する仕組みが追加されます。
テンプレートフィルターで、以下のテンプレートがカスタム投稿タイプに保存されるようになります。(WordPress5.8現在）
$filter_list = array( 'embed_template', '404_template', 'search_template',
'frontpage_template', 'home_template', 'privacypolicy_template',
'taxonomy_template', 'attachment_template', 'single_template',
'page_template', 'singular_template', 'category_template',
'tag_template', 'author_template', 'date_template',
'archive_template', 'index_template', );これらのテンプレートがカスタム投稿タイプに保存されることで、これまで、テーマに付属するテンプレートをカスタマイズする場合には、チャイルドテーマを作成する必要がありましたが、チャイルドテーマを作成しないくても、テンプレートのカスタマイズができるようになり、このことが「ノーコーディングでカスタマイズができる」といった言い方の意味です。
サイトエディタでヘッダー部分やフッタ部分を変更した場合は、それらもテンプレートパートファイルとして保存されます。
WordPressを初めて使い始めた方などは、「なんかめんどくせえ」話になりそうで、気が引けますが、大事な部分は、
WordPressのテンプレート階層の主要なテンプレートは、がHTMLテンプレートに置き換えられますが、全部のテンプレート階層が置き換えられるわけではないという事です。
チャイルドテーマを作らなくて済むなら、既存のサイトでFSEを有効にしたいと思うかもしれません。
実験してみましょう。
ブロックエディタ対応テーマの、TT1 blocks 0.4.7を使用して、Gutenberg を有効にします。コアは、WordPress5.7.2です。
テーマに、archive.phpを追加してみましょう。ファイルの中身は、hello archiveとだけ書いておきましょう。
適当なカテゴリーを開くと、 私の環境ではhello archive が表示されました。
実験2を行ってみます。
テーマをemulsion に切り替えて、archive.phpを追加して、PHPテンプレートが使用されるかどうかを調べてみたいと思います。
テーマのモードは、FSEにするのを忘れないでください。
結果、PHP テンプレートで表示されることはなく、表示に変化はありません。
なにがこの違いを生んでいるのでしょうか？
PHPテンプレートで表示するためには、emulsion テーマの block-templates内のテンプレートの名前を変更する必要があります。category.html , archive.htmlを他の名前にリネームしてみると、phpテンプレートが適用されます。
このことから、Full Site Editing対応テーマが、いくつかあった場合、異なる結果を生むということが理解できるはずです。
現在サイトエディタ対応テーマは、そういったPHPベースのテンプレートは存在しないので、問題が発生することはないかもしれませんが、私たちは、新しくサイトを作るだけでなく、現在のサイトを、新しいものに移行したいといった事が少なからずあります。
既存サイトから、ワードプレスの新しい仕組みに移行しようとするとおそらくテストは必須になると思います。
このようなことから、emulsionテーマでは、現在のテーマで表示する設定、現在のテーマのメイン部分だけを置き換える設定、（サイドバーの動作検証が、既存のサイトエディタ対応テーマでは、やりにくいので）フルサイトエディタ表示の3つのモードで表示できるように、フィルターを追加した主な理由です。
テンプレートは、テーマだけが使用するものではなく、プラグインでも、テンプレートを使うものはたくさんあります。あなたが使用するプラグインとの互換性をチェックする時も、このちょっと変わったテーマは、きっと役に立つだろうと思います。