ワードプレスの子テーマ作成

スポンサーリンク

子テーマとは?

「子テーマ」というだけあって、当然「親テーマ」がわるわけですが、

どういうことかと言いますと、

ワードプレスの既存テーマ(親テーマ)を引き継ぎつつ、一部分だけを上書きすることができます。

 

メリット

上書きされない

通常、テーマをアップデートすると、style.cssなども上書きされてしまいます。

子テーマは親テーマの設定を引き継ぎつつ、必要な部分だけを上書きすることができるため、

うっかりテーマをアップデートしてしまった場合も「また最初から作り直す」なんてことになりません。

 

管理が楽

必要なファイルだけをコピーしてくるので、どのファイルを編集したかが一目瞭然。

 

子テーマの作り方

では実際に子テーマを作っていきましょう。

まず、/wp-content/themesに子テーマのフォルダを作成します。

仮に「twentyeleven-child」というフォルダを作ります。(名前は任意で構いません。分かりやすいように自分の名前でも良いです。)

style.cssの作成

次に作成したフォルダの中に「style.css」を作成します。

この「style.css」に、子テーマをWordPressに認識させるための記述をするため、必須となります。

作成した「style.css」の先頭に以下を記述します。

Theme Name:作成した子テーマの名前

Template:子テーマに継承する、「親テーマのディレクトリ名」

※親テーマの「テーマ名」ではない。/wp-content/themesにある、親テーマのフォルダ名。

 

他にも「作成者」など色々と設定できますが、とりあえずこれで「管理画面⇒外観⇒テーマ」に、作成した子テーマが表示されます。

 

functions.phpによる、スタイルシート読み込み

-親テーマのスタイルを読み込む-

子テーマの「style.css」に@importで読み込むやり方をよく見かけますが、

動作も重くなるため、もっとスマートなやり方をご紹介します。

 

子テーマの「style.css」と同じ場所に「functions.php」を作成し、以下を記述します。

『get_template_directory_uri()』で親テーマまでのURLを取得しています。

設定が成功すれば、親テーマのスタイルが反映されます。

 

JSの読み込みなどもここに記述しておけるため、諸々を1つのファイルで一元管理できます。

 

以上で子テーマの作成は終わりです。