ワードプレスのテーマカスタマイズのために、チャイルドテーマがあります。
ブロックテーマでも、チャイルドテーマを作成することができます。（emulsion テーマは、version 2.2.0 でチャイルドテーマのサポートを行いました）
このページでは、emulsion テーマのチャイルドテーマについて、要点を説明します。
最小構成のチャイルドテーマ
index.php (emulsion テーマのindex.phpのコピー)
<?php
/**
* Theme emulsion
* archive template
*/
if ( ! defined( 'ABSPATH' ) ) {
exit;
}
do_action( 'emulsion_template_pre' );
do_action( 'emulsion_template_pre_' . basename( __FILE__, '.php' ) );
get_header();
emulsion_the_theme_supports( 'title_in_page_header' ) ? '' : emulsion_archive_title();
emulsion_action( 'emulsion_article_wrapper_before' );
emulsion_have_posts();
emulsion_action( 'emulsion_article_wrapper_after' );
emulsion_pagination();
get_footer();style.css
/*
Theme Name: emulsion child min
Theme URI: https://www.tenman.info/wp3/emulsion/
Author: Tenman
Author URI: http://www.tenman.info/wp3/
Version: 0.2
License: GNU General Public License v2.0
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Template: emulsion
*/note: emulsionテーマは、チャイルドテーマが作成されると、チャイルドテーマのstyle.cssをロードするので、functions.php でチャイルドテーマ用style.css ロードするコードは必要ありません。
このテーマでは、もし、(theme-slug).jsがチャイルドテーマに含まれている場合は、それも自動的にロードします。
一般的なチャイルドテーマの構成
親テーマの、block-templates, block-template-parts をコピーして、チャイルドテーマに含めます。必要に応じて、functions.phpを追加することも出来ます。
さて、このチャイルドテーマの構成にcategory.phpやcategory-624.phpといったテンプレートが含まれていますが、これは、クラッシックテーマのテンプレートのようにも見えます。
以下、これらのファイルの目的と使用方法について説明をしたいと思います。
HTMLテンプレートとPHPテンプレートの共存
emulsion テーマの、category.phpは、以下のように記述されています。
<?php
$theme_scheme = emulsion_get_theme_operation_mode();
get_template_part( 'template-parts/template', $theme_scheme ) ;
If a PHP template with the same priority exists in the child theme, the PHP template will be applied instead of the HTML template.
If a PHP template exists, you will not be able to edit it in the site editor.
get_template_part関数でincludeするテンプレートは、以下のものです。
template-fse.php
emulsion_block_template_part()を使用して、PHPからhtmlテンプレートを取得して表示します。
updated:2022/2/14 (ver 2.2.4)
template-parts/template-fse.php
<?php get_header( 'fse' ); ?>
<div class="wp-site-blocks">
<?php emulsion_block_template_part( 'header' ); ?>
<?php is_user_logged_in() ? printf( '<p style="background:#000;color:#fff">%1$s</p>', 'load PHP template:emulsion/template-parts/template-fse.php' ) : ''; ?>
<main class="wp-block-group alignfull">
<?php
if ( is_attachment() ) {
emulsion_have_posts();
} elseif ( is_single() ) {
emulsion_block_template_part( 'post-content' );
} elseif ( is_page() ) {
emulsion_block_template_part( 'page-content' );
} else {
emulsion_block_template_part( 'query-post' );
}
?>
</main>
<?php emulsion_block_template_part( 'footer' ); ?>
</div>
<?php wp_footer(); ?>
</body>
</html>updated:2022/2/14 (ver 2.2.4)
template-parts/template-transitional.php
<?php get_header(); ?>
<?php emulsion_the_theme_supports( 'title_in_page_header' ) ? '' : emulsion_archive_title(); ?>
<?php is_user_logged_in() ? printf( '<p style="background:#000;color:#fff">%1$s</p>', 'load PHP template:template-transitional.php' ) : ''; ?>
<div class="wp-site-blocks">
<?php
if ( is_attachment() ) {
emulsion_have_posts();
} elseif ( is_single() ) {
emulsion_block_template_part( 'post-content' );
} elseif ( is_page() ) {
emulsion_block_template_part( 'page-content' );
} else {
emulsion_block_template_part( 'query-post' );
}
?>
</div>
<?php get_footer(); ?>updated:2022/2/14 (ver 2.2.4)
template-parts/template.php
このテンプレートは、旧来のPHPテンプレートで表示します。
親テーマの、index.phpのコピーです。
<?php
get_header();
emulsion_the_theme_supports( 'title_in_page_header' ) ? '' : emulsion_archive_title();
is_user_logged_in() ? printf( '<p style="background:#000;color:#fff">%1$s</p>', 'load PHP template:emulsion/template-parts/template.php' ) : '';
emulsion_action( 'emulsion_article_wrapper_before' );
emulsion_have_posts();
emulsion_action( 'emulsion_article_wrapper_after' );
emulsion_pagination();
get_footer();つまり、テンプレート階層の優先度が同じ場合、この場合、category.htmlとcategory.phpが両方存在した場合には、PHPテンプレートが優先するという機能に基づいて、作成しています。
さて、PHPテンプレートで表示することにどんな意味があるのでしょうか？
私自身は、従来テーマが持っていた 条件分岐タグなどを使用できなくなっているため、今のところ使用する余地があると考えています。
例えば、is_user_logged_in()等を使用した場合のことを想像してみてください。非ログインユーザーには、コンテンツを非表示にするといった事が、簡単に実現できるでしょう。
note:CSSとPHPの共存は、まだ十分なテストが完了していません。問題に気付いた場合は、theme support forum に書き込んでいただけると嬉しいです。
CSSのカスタマイズについて
クラッシックテーマでは、CSSの主役はテーマでしたが、HTMLテンプレートを使用する新しいテーマでは、コアにすでにCSSが保持されており、その役割は、大きく減少していると思います。
カスタマイザーのAdditional CSSの使用に慣れている人も多いと思いますが、スタイルのカスタマイズは、エディタ（full site editor)に移行しました。
エディタの設定とコンフリクトしないAdditional CSSの記述は非常に難しくなりつつあります。
しかし、おそらく特定の条件でCSSの調整が0になる事もないでしょう。この困難さの軽減のために、emulsion テーマは、body要素のクラスを強化しています。
body 要素に、id=”(theme-slug)” が追加されます(フルサイト編集テーマを除く）。このidをスタイルに含めることにより、ユーザーは、高い特異性をもってスタイルを追加できます。
現在のテーマスキームに関連したbody classが追加されます。
is-presentation-transitional, is-presentation-fse, is-presentation-theme現在のテンプレートに関連したbody classが追加されます。
is-tpl-index-php, is-tpl-home_template,is-tpl-single_template ...