子テーマを自分で作成するのは難しい事ではないのですが、子テーマを何個もまとめて作成するとなると大変だし面倒になることがあります。
最近になって子テーマの作成がプラグインで出来ることを今さら知った私ですが、実際に子テーマを作成するWordPressのプラグインを使ってみると設定の必要がなくて、使い方もかなり簡単に子テーマ作成ができます。
プラグインのOne-Click Child Themeで出来ること
子テーマを作成できるWordPressのプラグインは「One-Click Child Theme」です。
プラグインのOne-Click Child Themeで出来ることは「子テーマの作成」
サイトのデザインをカスタマイズするときのstyle.cssや機能を追加することができるfunctions.phpをOne-Click Child Themeを使用してワンクリックで簡単に作成ができ作業の効率化ができるプラグインです。
One-Click Child Themeは他にもsingle.phpやindex.phpなど、使用する親テーマにあるphpファイルを数秒でコピーして子テーマ作成してくれます。
そしてOne-Click Child Themeには、子テーマのテーマ画像に使用するスクリーンショットをWordPress.orgのAPIを使用してテーマ画像作成がやりやすくなってます。
WordPressのプラグインのOne-Click Child Themeは、子テーマをまとめて作成する場合や子テーマ作成をしたことがない初心者さんにもおすすめなプラグインです。
One-Click Child Themeの使い方(インストール)
One-Click Child Themeを使う場合は、2019年7月5日にWordPressの公式ページからの配布が停止になっているのでプラグインのインストールは「GitHub」からzipファイルをダウンロードしてきてインストールします。
GithubでOne-Click Child Themeを入手
GitHubのOne-Click Child Themeページを開くと以下の画像のように「Clone or download」のボタンがあるのでクリックして「Download ZIP」でWordPressにインストールするOne-Click Child Themeのプラグインファイルをダウンロードします。
そして「GitHub」からダウンロードしたOne-Click Child Themeのzipファイルを、WordPressの管理画面の「プラグインのアップロード」でインストールします。
WordPressにインストールするOne-Click Child Themeのファイルは解凍しないでzipファイルの状態でインストールしてください。
One-Click Child Themeをインストールして有効化するとWordPressの管理画面の外観に「Child Theme」が表示されます。
Child Themeがインストールされて有効化したOne-Click Child Themeなのでクリックして子テーマを作成します。
子テーマ作成方法
One-Click Child Themeは現在使用してる親テーマに対しての子テーマが作成されるのでテーマがWordPressで有効化されてるか確認をしておきます。
そして「Create a Child Theme」画面で子テーマを作成します。
- Theme Name 親テーマ名-child
- Description 子テーマの説明
- Author 子テーマの作成者名
One-Click Child Themeプラグインは親テーマに対して、まだ子テーマが1個もない場合は子テーマディレクトリが作成されて、「Create a Child Theme」で入力した内容が作成する子テーマのスタイルシートヘッダに記述されstyle.cssが作成されます。それと同時functions.phpの子テーマも作成されます。
すでに子テーマディレクトリが存在する場合は、子テーマディレクトリに入ってる以外の子テーマを選んでファイル作成する使い方になるので後述します。
子テーマディレクトリから作成の実行は「Create a Child」をクリックして実行します。
既存の子テーマディレクトリがなかったとき「Create a Child」をクリックして子テーマが作成された時点で作成した子テーマが有効化されます。
子テーマが作成されるのはstyle.cssとfunctions.phpですが、もしかすると「rtl,css」も作成されてるかもしれません。
RTLスタイルシートとは？
「Ｒight To Left アラビア語やヘブライ語のように右から左で記述する言語」WordPressは現在7種類のRTL言語に対応している。
このように言語が違い記述の方向が違いで使用するので、使用する予定がなければ削除しても大丈夫です。
親テンプレートからワンクリックで子テーマ作成する
次は子テーマディレクトリが既に作成されていて、子テーマを後からOne-Click Child Themeで作成する場合の使い方です。
プラグインのOne-Click Child Themeは有効化してるテーマで、子テーマがまだ作成されてない親のテンプレートをワンクリックでコピーします。
なので、使用してるテーマの親テーマと既存の子テーマによっては選べる親テーマのテンプレートの種類と数は変わります。
例としてtwenty seventeenで初めてOne-Click Child Themeを使って子テーマ作成して場合はstyle.cssとfunctions.php以外の下記の子テーマ作成ができます。
- 404.php
- archive.php
- comments.php
- footer.php
- front-page.php
- index.php
- page.php
- search.php
- searchform.php
- sidebar.php
- single.php
One-Click Child Themeの子テーマ作成画面で作成したいファイル名を選んだら「Copy Template」をクリックすると作成ファイルはテーマディレクトリに格納されます。
作成後にテーマディレクトリからも確認してみてください。
One-Click Child Themeプラグイン「mshot」の使い方
「デフォルトでは、ワンクリックの子テーマは親テーマのスクリーンショットを使用します。WordPress..comのmshotサービスを使用して、現在の子テーマのスクリーンショットを現在のWebサイトのホームページのスクリーンショットに置き換えることができます。(Webから一般公開されている場合)。)」
という説明がOne-Click Child Themeの説明にあります。これは作成した子テーマのテーマ画像を変更するときにmshotが使えますよ。ということのようです。
One-Click Child Themeでスクリーンショットの置き換え前は親テーマの画像になってますが、子テーマのスクリーンショットを置き換えるために「Replace Screenshot」をクリックして実行すると上記の画像のように変更されます。これだとなんか微妙な子テーマ画像です。
mshotを使う場合は
上記のURLのドメインを自分のドメインに変更してブラウザで開くとスクリーンショットがプレビューされます。
URLの「w=880&h=660」は「w」で横「h」で縦のスクリーンショットの幅を指定していて、変更するとmshotのスクリーンショット幅が調整できます。
何かOne-Click Child Themeで使うmshotの別のやり方がありそうですが、あまり理解できてないし普通にスクリーンショットする時と比べるとサイズ指定が楽になるくらいのような気もします。
子テーマを作成したら使ってみる
プラグインのOne-Click Child Themeで作成した子テーマが使えるか試してみます。
今回、私が子テーマ作成で使用したtwentyseventeenのカスタマイズテストをしてみます。
get_template_part( 'template-parts/post/content', 'excerpt' );
子テーマindex.phpに上記のコードを書いて記事を抜粋させてから
作成した子テーマのstyle.cssには下記のCSSを書いてみます。
.entry-title a {
color: #f78da7;
text-decoration: none;
margin-left: -2px;
}
a {
color: #5b6ed9f7;
text-decoration: none;
}
One-Click Child Themeプラグインで作成した子テーマを使ってカスタマイズが出来るようになりました。
子テーマを作成するプラグイン「One-Click Child Theme」の使い方はワンクリックで子テーマが使えるようになるので子テーマ作成のときは活用してみてください。
