当サイトが導入しているWordPressテーマ・TCD「RIKYU」では、一般的な子テーマ設定を使用すると、ごく一部のエフェクトが消えてしまいます。この問題への対処はいちおう可能と思われますが、今も動作検証中のため、途中経過の備忘録として情報を残しておくことにしました。
なお、本記事はあくまで参考情報であり、以下の点にご注意願います。
また、子テーマの利用を含むカスタマイズは、株式会社デザインプラス様のサポート対象外ですので、本件に関するお問い合わせ等もご遠慮ください。
子テーマの使用に関する一般的な情報
WordPressテーマを使用する際に、子テーマを導入することには多くのメリットがあります。その利点やファイル作成・導入に関する詳しい情報は、以下のTCD公式ブログが非常に分かりやすく、参考になりました。
「RIKYU」での子テーマ使用時に発生する問題
上記ブログの記事のうち、標準的な子テーマの作成方法を用いると、「トップページやアーカイブの画像から、ホバーエフェクト※1が消える」といった形で、「RIKYU」の一部の機能が正しく動作しなくなります。
※1 画像へのマウスオーバー時に適用される、画像のズームイン・アウトやスライド等の効果。
この状態でも、ごく一部の機能以外は何とか動いているような気がするものの、せっかくの凝ったデザインが消えてしまうのは、もったいないと感じるところです。
以下の記事のように、無理をしてまで子テーマを使う必要はありませんが、ECサイトとしてWooCommerceを使っていると、どうしてもfunctions.phpへの追記が必要になりそうな場面も出てきます。そして、TCDテーマは頻繁にバージョンアップされるので、その度に本体のPHPファイルを書き換えるのは、非常に面倒、かつ高リスクです。
対策用の「functions.php」
その後、あれこれと試行錯誤した結果、とりあえず仮の解決策には辿り着きましたので、ここに備忘録としてメモしておきます。ただし、現時点では検証不足のため、当サイト以外でのご利用はおすすめできません。うっかりご利用された場合、どのような影響が出ても当サイトでは責任を持てませんので、くれぐれもご注意ください。
結論としては、先にご紹介したTCDブログで記載されている「SERUM」用コードの、親テーマ側のスタイルIDを「style」に変更することで、いちおう正常に動作するような気がします。
上記サイトの例から、該当箇所を変更すると、以下のようなコードになります。
<?php
// 念のため優先度を設定
add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles', 11 );
function theme_enqueue_styles() {
// 親テーマのstyle.cssを登録解除
wp_dequeue_style('style');
wp_deregister_style('style');
// 親テーマのstyle.cssを「style」として再登録
wp_enqueue_style( 'style', get_template_directory_uri() . '/style.css' );
// 子テーマのstyle.cssを登録、依存関係として親テーマのスタイルを指定
wp_enqueue_style( 'child-style', get_stylesheet_directory_uri() . '/style.css', array('style') );
}
?>
参考:TCD「WordPressの子テーマを作る理由と子テーマを自作する方法」
スタイルIDに一般的な「parent-style」を使わず、親テーマ「RIKYU」本来のID「style」として残す形になり、結果としては「SERUM」と同じ手順で、きちんと動いているようですが……。
なお、今回の子テーマ用ファイルの修正にあたっては、以下の記事も参照させていただきました。
実際の動作については、もう少し検証を続け、できるだけ改善を試みていきたいと思います。このブログの内容も、内容が間違っていた場合は前触れなく修正が入ったり、コードが変更されていたりするかもしれませんが、そのあたりはどうかお目こぼしください。