人気テーマのSWELLは、購入者ページで専用の子テーマを配布しています。
数年前まではカスタマイズをするなら「子テーマを導入するのは必須」という風潮がありましたが、最近はあまり声高に言われなくなりました。
なぜかと言えば、最近のWordpressのアップデートと、テーマのカスタマイズ性の向上から、子テーマを使用せずとも基本的なカスタマイズは出来てしまうからです。
この記事ではSWELLで子テーマを導入する方法やメリット・デメリットについて説明します。
WordPressの子テーマはなぜ必要？
子テーマが必要なのは親テーマのファイルを変更するような高度なカスタマイズを行う場合です。
親テーマのファイルを直接カスタマイズすると、親テーマのアップデートで消えてしまうため、子テーマが必要になります。
初級者～中級者ぐらいまでは、カスタマイズで編集する子テーマのファイルは、style.cssとfunctions.phpの2つでしょう。
もともと、子テーマにはこの2つ以外のテンプレートファイルは無く、自分で追加する必要があります。それを実行する人は崇高な使命を持ったWordpressについてかなりの手練れだけでしょう。
子テーマを持つ理由は、親テーマとは別のstyle.cssとfunctions.phpを持つということですから、この2つをファイルとして持つ必要が無ければ、子テーマはとりあえず不要になります。
SWELLの子テーマ作成方法
SWELLで子テーマを導入する場合は、一番最初から導入した方がよいです。
子テーマを後から導入すると、いろいろと問題が起きることがあります。
- SWELL公式サイトからSWELL子テーマをダウンロード
- 自分で子テーマを作成
SWELLの子テーマは公式サイトからダウンロードできますので、SWELLを購入したユーザーであればそれをダウンロードするのが一番早いです。
SWELLは、GPL100%テーマであるため正規に購入しなくても利用することができますから、公式サイトからダウンロードできない人も一定数いると思います。
その場合は、以下のSWELL公式子テーマの内容を参考に、自分で子テーマを作成すれば大丈夫です。
SWELL公式の子テーマの内容
SWELL公式で配布している子テーマがあります。
swell-childというディレクトリに、functions.php、style.cssという2つのファイルが在るだけです。
styles.cssには特に何も書かれていません。
functions.phpにはユーザーが自分でコードを追加することを考慮した親切な内容になっています。
SWELLの作者は結構親切な人だと思います。
SWELL子テーマのstyle.css
@charset "UTF-8";
/*
Template: swell
Theme Name: SWELL CHILD
Theme URI: https://swell-theme.com/
Description: SWELLの子テーマ
Version: 1.0.0
Author: LOOS WEB STUDIO
Author URI: https://loos-web-studio.com/
License: GNU General Public License
License URI: http://www.gnu.org/licenses/gpl.html
*/SWELL子テーマのfunctions.php
<?php
/* 子テーマのfunctions.phpは、親テーマのfunctions.phpより先に読み込まれることに注意してください。 */
/**
* 親テーマのfunctions.phpのあとで読み込みたいコードはこの中に。
*/
add_filter('after_setup_theme', function(){
}, 11);
/**
* 子テーマでのファイルの読み込み
*/
add_action('wp_enqueue_scripts', function() {
$timestamp = date( 'Ymdgis', filemtime( get_stylesheet_directory() . '/style.css' ) );
wp_enqueue_style( 'child_style', get_stylesheet_directory_uri() .'/style.css', [], $timestamp );
/* その他の読み込みファイルはこの下に記述 */
}, 11);子テーマは必ず必要なわけではない
子テーマのstyle.cssを使わない方法
WordPressには、コアの機能として外観⇒カスタマイズ⇒追加CSSというCSS追加機能が組み込まれています。
この追加CSSは<head>の一番最後にCSSとして吐きだされるので、親テーマのスタイルはすべて上書きできます。
子テーマのstyle.cssはとりあえず必要なくなります。
子テーマのfunctions.phpを使わない方法
WordPressにはアクションフックやフィルターフックなどの機能を使って、動作をカスタマイズできることになっています。
そのための短いスニペットが多数公開されていますが、そのスニペットの貼り付け先は子テーマのfunctions.phpになります。
functions.phpを使わずに、PHPのコードを追加できる便利なプラグインとしてCode Snippetsがあります。
Code Snippetsを使えば、子テーマのfunctions.phpも不要になってしまいます。
子テーマで自由にカスタマイズしてほしくないというのがテーマ制作側の本音か
TCDテーマの公式ブログで子テーマを使うデメリットの記事を書いていますが、かなり的外れだと思います。
カスタマイズで質問が来ることを嫌がっているのがよくわかります。
子テーマによるカスタマイズは、サポート対象外と明確に書かれていますが、それでも質問がくるから予防線を張っているのでしょう。
これを真に受けているTCDユーザーは可愛そうだと思いました。
子テーマを使わないデメリット
子テーマは要らんのではないか？という話をしてきましたが、子テーマが必要な場面は結構あります。
子テーマを使うメリットは、ファイルのカスタマイズであるということです。
子テーマを使わないカスタマイズの特徴
- 追加CSSでカスタマイズした内容はデータベースに保存されています。
- CodeSnippetsでカスタマイズした内容もデータベースに保存されています。
カスタマイズをデータベースに保存すると起こる不都合
- 他のサイトでカスタマイズ内容がコピーできない
- バックアップが簡単にとれない
- サイトが壊れた時にFTPで簡単に修正できない
- ファイルを分けてCSS管理できない
- SaaSなどを使えない
子テーマを使うメリット
他のサイトにテーマカスタマイズをコピーしやすい
子テーマのフォルダをzipでダウンロードして、他のサイトにアップロードすれば簡単に子テーマのカスタマイズを使いまわせます。
ファイルにカスタマイズしているので、ファイルをコピーすればカスタマイズ内容がそのままコピーされます。
バックアップが簡単にとれる
テーマフォルダをFTPなどでダウンロードすればバックアップができます。
サイトが壊れた時にFTPで簡単に修正できる
functions.phpを編集してサイトが表示できなくなっても、FTPでfunctions.phpを編集すれば元に戻ります。
Code Snippetsを用いてもカスタマイズしたときに稀にサイトが表示できなくなる時があります。
その時にダッシュボードログインができなくなると最悪で、修正するために再度ログインできるようにかなり面倒なことをしなければなりません。
Code Snippetsのコードはデータベースに保存されているので、FTPでは修正できません。
ファイルを分けてCSS管理をしたい
子テーマを使えば、CSSの読み込みはファイルを分けることも可能です。
追加CSSは便利なのですが、CSSが増えてくるとかなり見通しが悪くなります。本格的にCSSを追加するときはファイルを分けたくなると思います。
また、追加CSSは入力欄が狭いのも難点です。
SaaSなどを使いたい
これは特殊な場合ですが、SaaSなどを用いてカスタマイズを行いたい場合は、SaaSファイルをコンパイルしたファイルをアップロードするような環境を作って、ゴリゴリカスタマイズするのが一般的だと思います。
その場合は、子テーマを使う方が便利でしょう。
SWELLで子テーマを導入するメリットは？
初心者の方は、SWELLの子テーマは必ず必要なのでは？と思って導入してみたけど、活用する場面も無いという人は多いと思います。
というのも、SWELLの場合は、カスタマイザーやらSWELL設定などから細かく設定が変更できるようになっているので、子テーマにファイルを追加しなければいけない場面は少ないからです。
子テーマにファイルを追加しないカスタマイズなら、子テーマを使わなくても全然問題なくカスタマイズは出来ますから、SWELLでは子テーマを無理に導入しなくても、追加CSSとCode Snippetsを組み合わせればよいでしょう。
SWELLをゴリゴリカスタマイズしたい上級者の場合は、子テーマは必須です。
SWELLの高度なカスタマイズはテンプレートファイルをコピーして書き換えるのがスタンダードです。
コメント