子テーマはWordPressのキーワードのひとつで、初心者を混乱させる。子テーマの名前を聞いたことがあっても、複雑そうなので作るのをやめてしまったという人もいるかもしれません。
それはわかります。しかし、私たちの経験では、子テーマはあなたの頭痛の種をたくさん救うことができます。貴重なカスタマイザーを保護し、サイトを壊すことなく試すことができ、テーマの更新を簡単にします。
ご興味のある方は、この初心者向けのガイドで、子テーマの仕組み、カスタマイズ方法、子テーマの変更方法について説明しています。
子テーマの仕組みと必要性
子テーマは、別のWordPressテーマのすべての機能、関数、スタイルを継承します。子テーマを作成した場合、元のテーマは親テーマと呼ばれます。
継承には、テーマのメインスタイルを定義する親テーマのstyle.cssファイルが含まれます。子テーマは独自のファイルを追加するか、既存のファイルを修正することで、継承されたプロパティを上書きまたは拡張できます。
子テーマをインストールしなくてもWordPressテーマをカスタマイズすることは可能ですが、子テーマが必要な理由はいくつかあります:
- 子テーマはテーマ更新時にカスタマイザーを保護し、上書きされないようにします。親テーマを直接変更した場合、その調整は更新時に消えてしまうかもしれません。
- 子テーマは、ステージング環境と同様に、サイトのオリジナルテーマを台無しにすることなく、安全に新しいデザインや機能を試すことができます。
- もしあなたがコードの書き方を知っているなら、子テーマは開発プロセスをより効率的にすることができます。子テーマのファイルは親テーマのファイルよりもずっとシンプルです。親テーマの変更または拡張したい部分だけを修正することに集中できます。
WordPressの子テーマを作る前にやるべきこと
多くのWordPressユーザーが、技術的なことに興奮しながらも、エラーが出て落胆しているのを私たちは見てきました。それはわかります。だからこそ、子テーマを作成する前に、自分が何をしようとしているのかを知ることが重要なのです。
このステップ・バイ・ステップ・ガイドを続ける前に、まずやっておくことをお勧めします:
- コードを扱うことを意識してください。最低限、HTML、CSS、PHP、オプションとしてJavaScriptの基本的な知識があれば、どのような変更が必要かを理解することができます。これについてはWordPressテーマハンドブックで詳しく説明されています。
- 希望のサイトデザインと機能を備えた親テーマを選びましょう。可能であれば、ほんの少しの変更で済むものを探しましょう。必要であれば、WordPressテーマを変更する前にやるべきことのチェックリストに従ってください。
- テーマ開発には、ローカルサイトまたはステージングサイトを使用してください。本番サイトで意図しないエラーを発生させたくないからです。
- まずサイトをバックアップしましょう。初めての場合は、Duplicatorのようなバックアッププラグインを使用することをお勧めします。
既存のテーマから子テーマを作成するには、いくつかの方法があります。ひとつは手作業でコードを書く方法、もうひとつはプラグインを必須とする方法です。
技術的な経験が乏しい場合、最初の方法は敷居が高く感じられるかもしれません。とはいえ、プラグインを使用する方法を選択した場合でも、手順と関連ファイルに慣れるために、マニュアルを一読することをお勧めします。
プロのヒント 子テーマを作成せずにテーマをカスタマイズしたいですか?WPCodeを使えば、サイトを壊すことなく、カスタムコードスニペットで安全に新機能を有効化できます。
すべてを理解した上で、WordPressで子テーマを作成する方法を説明しよう。以下のリンクからお好きな方法にジャンプできます:
- Method 1: Creating a Child WordPress Theme Manually
- Method 2: Creating a Child Classic Theme With a Plugin
- Method 3: Creating a Child Block Theme With a Plugin
- Bonus Tip: Find Out If Your Theme Has a Child Theme Generator
- How to Customize Your Classic Child Theme
- How to Customize Your Block Child Theme
- How to Edit a Child Theme's Template Files
- How to Add New Functionality to Your Child Theme
- How to Troubleshoot Your WordPress Child Theme
方法1:WordPressの子テーマを手動で作成する
まず、WordPressインストールフォルダーの/wp-content/themes/を
開きます。
WordPressホスティングサービスのファイルマネージャーまたはFTPクライアントを使用してこれを行うことができます。私たちは、最初の設定の方がずっと簡単だと思うので、それを使います。
あなたがBluehostのクライアントであれば、ホスティングアカウントのダッシュボードにログインし、’ウェブサイト’タブに移動することができます。その後、 ‘設定’をクリックします。
概要」タブで「クイックリンク」セクションまでスクロールダウンします。
次に「ファイルマネージャー」を選択する。
この段階で、サイトのpublic_htmlフォルダーに行き、/wp-content/themes/
パスを開く必要がある。
ここで、左上の「+フォルダー」ボタンをクリックして、子テーマ用の新規フォルダーを作成します。
フォルダーには好きな名前をつけることができる。
このチュートリアルでは、Twenty Twenty-Oneを親テーマとして使用するため、twentytwentyone-childというフォルダー名を使用します。完了したら、「新規フォルダーを作成」をクリックします。
次に、先ほど作成したフォルダーを開き、「+ File」をクリックして、子テーマの最初のファイルを作成します。
FTPクライアントを使用している場合は、メモ帳のようなテキストエディターを使って、後でファイルをアップロードすることができます。
このファイルを「style.css」と命名してください。これは子テーマのメイン・スタイルシートであり、子テーマに関する情報を含むからです。
そして、『新規ファイルを作成』をクリックします。
style.cssファイルを右クリックする。
その後、下のスクリーンショットのように「編集」をクリックして新しいタブを開きます。
この新しいタブで、以下のテキストを貼り付け、必要に応じて調整することができます:
/*
Theme Name: Twenty Twenty-One Child
Theme URI: https://wordpress.org/themes/twentytwentyone/
Description: Twenty Twenty-One child theme
Author: WordPress.org
Author URI: https://wordpress.org/
Template: twentytwentyone
Version: 1.0.0
Text Domain: twentytwentyonechild
*/
完了したら、「変更を保存」をクリックするだけです。
次に必要なことは、2つ目のファイルを作成し、functions.phpと名付けることです。このファイルは、親テーマのファイルからスタイルシートをインポートまたはエンキューします。
ドキュメントを作成したら、以下のwp_enqueueコードを追加する:
add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles' );
function my_theme_enqueue_styles() {
$parenthandle = 'twenty-twenty-one-style'; // This is 'twenty-twenty-one-style' for the Twenty Twenty-one theme.
$theme = wp_get_theme();
wp_enqueue_style( $parenthandle, get_template_directory_uri() . '/style.css',
array(), // if the parent theme code has a dependency, copy it to here
$theme->parent()->get('Version')
);
wp_enqueue_style( 'custom-style', get_stylesheet_uri(),
array( $parenthandle ),
$theme->get('Version') // this only works if you have Version in the style header
);
}
完了したら、前のステップと同じようにファイルを保存する。
注: この方法では、子テーマのスタイルシートが正しく読み込まれるように、公式の「Child ThemesandIncluding Assets」のドキュメンテーションを読むことをお勧めします。
これでとても基本的な子テーマができました。WordPress管理画面の外観 ” テーマを 開くと、Twenty Twenty-One子テーマの設定があるはずです。
有効化」ボタンをクリックして、子テーマのサイトでの使用を開始します。
方法2:プラグインで子クラシックテーマを作る
次の方法では、Child Theme Configuratorプラグインを使用します。この使いやすいWordPressプラグインを使うと、コードを使わずにWordPressの子テーマを素早く作成・カスタマイズできますが、クラシックな(ブロックではない)テーマでしかうまく動作しません。
最初に行う必要があるのは、WordPressプラグインをインストールして有効化することです。有効化したら、WordPressダッシュボードのツール ” 子テーマに移動する必要があります。
親/子タブで、アクションを選択するよう求められます。CREATE a new Child Theme “を選択してください。
次に、ドロップダウンメニューから親テーマを選択する。ここではHestiaテーマを選択します。
その後、「分析」ボタンをクリックして、テーマが親テーマとして使用するのに適していることを確認します。
次に、子テーマを保存するフォルダー名を尋ねられます。任意のフォルダー名を使用できます。
その下で、新規スタイルを保存する場所を選択する必要があります:プライマリスタイルシートか区切り。
プライマリスタイルシートは、子テーマに付属するデフォルトのスタイルシートです。このファイルに新しいカスタマイザーを保存すると、子テーマのメインスタイルを直接変更することになります。すべての変更は元のテーマのスタイルを上書きします。
区切りオプションを使用すると、新しいカスタムスタイルを別のスタイルシートファイルに保存できます。元のテーマのスタイルを保持し、上書きしたくない場合に便利です。
デモンストレーションのため、最初のオプションを設定します。しかし、子テーマのカスタマイゼーションをよりクリエイティブにしていくうちに、いつでもこのプロセスを繰り返し、2番目のオプションを選択することができます。
下に進むと、親テーマのスタイルシートへのアクセス方法を選択しなければならない。
プラグインが自動的に適切なアクションを決定するので、初期設定の「Use the WordPress style queue」にします。
ステップ7に進んだら、「Click to Edit Child Theme Attributes」と書かれたボタンをクリックします。
その後、子テーマの詳細を記入することができます。
手動で子テーマを作成すると、親テーマのメニューやウィジェットが失われます。Child Theme Configuratorはそれらを親テーマから子テーマにコピーすることができます。これを行いたい場合は、ステップ8のボックスにチェックを入れてください。
最後に、「新規子テーマを作成」ボタンをクリックして、新しい子テーマを作成します。
プラグインは子テーマ用のフォルダを作成し、後でテーマをカスタマイズするために使用するstyle.cssとfunctions.phpファイルを追加します。
テーマを有効化する前に、画面上部のリンクをクリックしてプレビューし、見栄えがよく、サイトを壊さないことを確認してください。
すべてがうまくいっているようであれば、「有効化して公開する」ボタンをクリックしてください。
これで子テーマが公開されます。
この段階では、子テーマは親テーマとまったく同じ外観と動作をします。
方法3:プラグインで子ブロックテーマを作る
ブロックテーマを使用している場合、WordPressはCreate Block Themeプラグインで簡単に子テーマを作成できます。
まず、WordPressプラグインをインストールして有効化する必要があります。その後、外観 ” ブロックテーマを作成する。
ここで、’Create a Child of [現在のテーマ名]’を選択するだけです。
次に、子テーマの情報を入力します。この例ではTwenty Twenty-Fourを使っているので、Twenty Twenty-Four Childという名前にします。
また、子テーマの説明と投稿者を指定しました。完了したら、「子テーマを作成」ボタンをクリックします。
プラグインはWordPressテーマのzipファイルを作成し、管理エリアにインストールします。
完了すると、あなたのサイトは自動的にこの新しく作成された子テーマを有効化します。外観 ” テーマで確認できます。
ボーナスのヒントテーマに子テーマジェネレータがあるか調べる
運がよければ、WordPressテーマにはすでに子テーマを作成する機能が備わっているかもしれない。
例えば、Astraを使用している場合、Astra Child Theme Generatorのサイトに行くことができます。その後、子テーマ名を記入して「Generate」ボタンをクリックするだけです。
ブラウザーは自動的に子テーマをコンピューターにダウンロードし、WordPressにインストールすることができます。
また、子テーマジェネレータを持つ他の人気WordPressテーマもいくつか見つけました:
クラシック子テーマのカスタマイズ方法
注: このセクションはクラシックWordPressテーマユーザー向けです。ブロックテーマをお使いの場合は、次のセクションに進んでください。
技術的には、テーマカスタマイザーを使えば、コードなしで子テーマをカスタマイズできます。そこで行った変更は親テーマには影響しません。コーディングにまだ慣れていない場合は、カスタマイザーを自由に使ってください。
とはいえ、子テーマをコードでカスタマイズすることもお勧めします。
WordPressテーマ開発についてさらに詳しく学べるだけでなく、コードのカスタマイザーによって、子テーマのファイル内に変更をドキュメント化することができ、その追跡が容易になります。
さて、子テーマをカスタマイズする最も基本的な方法は、style.cssファイルにカスタマイザーCSSを追加することです。そのためには、どのコードをカスタマイズする必要があるのかを知っておく必要があります。
親テーマから既存のコードをコピーして修正することで、プロセスを簡素化できます。このコードは、ChromeやFirefoxのInspectツールを使うか、親テーマのCSSファイルから直接コピーすることで見つけることができます。
方法1:ChromeまたはFirefoxのインスペクタからコードをコピーする
修正が必要なCSSコードを発見する最も簡単な方法は、Google ChromeやFirefoxに付属しているインスペクター・ツールを使うことです。これらのツールを使えば、ウェブページのあらゆる要素の背後にあるHTMLとCSSを見ることができます。
インスペクターツールについては、inspect要素の基本:DIYユーザーのためのWordPressカスタマイズガイドで詳しく説明しています。
ウェブページを右クリックしてinspect要素を使うと、そのページのHTMLとCSSが表示されます。
HTMLの行の上にマウスを移動すると、インスペクタがその行を上のウィンドウでハイライトします。また、ハイライトされた要素に関連するCSSルールもこのように表示されます:
そこでCSSを編集して、どのように見えるか試してみることができる。例えば、テーマのボディの背景色を#fdf8efに変更してみましょう。body {と
書かれたコードの行を探し、その中にcolor:
.
color:
の隣にあるカラーピッカーのアイコンをクリックし、HEXコードを適切なフィールドにペーストするだけです:
これで、CSSを使って背景色を変更する方法がわかりました。変更を恒久的なものにするには、子テーマディレクトリのstyle.cssファイルを(ファイルマネージャまたはFTPを使って)開きます。
そして、子テーマの情報の下に、以下のようなコードを貼り付ける:
/*
Theme Name: Twenty Twenty-One Child
Theme URI: https://wordpress.org/themes/twentytwentyone/
Description: Twenty Twenty-One child theme
Author: WordPress.org
Author URI: https://wordpress.org/
Template: twentytwentyone
Version: 1.0.0
Text Domain: twentytwentyonechild
*/
body {
background-color: #fdf8ef
}
WordPressのエディターから外観 “テーマファイルエディターを開くと、以下のようになります:
もしあなたが初心者で、他の変更を加えたいのであれば、HTMLとCSSに精通し、各コードがどの要素を指しているのかを正確に把握することをお勧めします。HTMLとCSSのチートシートはオンライン上にたくさんあるので、それを参考にするとよいでしょう。
ここに子テーマ用に作成したスタイルシートがあります。自由に実験し、修正してください:
/*
Theme Name: Twenty Twenty-One Child
Theme URI: https://wordpress.org/themes/twentytwentyone/
Description: Twenty Twenty-One child theme
Author: WordPress.org
Author URI: https://wordpress.org/
Template: twentytwentyone
Version: 1.0.0
Text Domain: twentytwentyonechild
*/
.site-title {
color: #7d7b77;
}
.site-description {
color: #aba8a2;
}
body {
background-color: #fdf8ef;
color: #7d7b77;
}
.entry-footer {
color: #aba8a2;
}
.entry-title {
color: #aba8a2;
font-weight: bold;
}
.widget-area {
color: #7d7b77;
}
方法2:親テーマのstyle.cssファイルからコードをコピーする
もしかしたら、子テーマにはカスタマイズしたいものがたくさんあるかもしれません。そのような場合は、親テーマのstyle.cssファイルから直接コードをコピーして、子テーマのCSSファイルにペーストし、修正したほうが早いかもしれません。
やっかいなのは、テーマのスタイルシート・ファイルが初心者にはとても長く、圧倒的に見えることだ。しかし、一度基本を理解すれば、実はそれほど難しくはない。
Twenty Twenty-Oneの親テーマのスタイルシートから実際の例を使ってみよう。WordPressインストールフォルダの/wp-content/themes/twentytwentyoneに
移動し、ファイルマネージャー、FTP、またはテーマファイルエディターでstyle.cssファイルを開く必要があります。
次のようなコード行が表示される:
:root {
/* Colors */
--global--color-black: #000;
--global--color-dark-gray: #28303d;
--global--color-gray: #39414d;
--global--color-light-gray: #f0f0f0;
--global--color-green: #d1e4dd;
--global--color-blue: #d1dfe4;
--global--color-purple: #d1d1e4;
--global--color-red: #e4d1d1;
--global--color-orange: #e4dad1;
--global--color-yellow: #eeeadd;
--global--color-white: #fff;
--global--color-white-50: rgba(255, 255, 255, 0.5);
--global--color-white-90: rgba(255, 255, 255, 0.9);
--global--color-primary: var(--global--color-dark-gray); /* Body text color, site title, footer text color. */
--global--color-secondary: var(--global--color-gray); /* Headings */
--global--color-primary-hover: var(--global--color-primary);
--global--color-background: var(--global--color-green); /* Mint, default body background */
--global--color-border: var(--global--color-primary); /* Used for borders (separators) */
}
3行目から15行目までは、テーマ全体が使用する色のタイプ(黄色、緑、紫など)を特定のHEXコードでコントロールする。そして、’global-color-primary’や’global-color-secondary’のような行は、そのテーマの原色と副色を意味します。
これらのコード行を子テーマのスタイルシートにコピーし、HEXコードを変更することで、完璧な配色を作ることができる。
親テーマのスタイルシートを下にスクロールしていくと、他の変数にもこのような色の変数があることに気づくだろう:
/* Buttons */
--button--color-text: var(--global--color-background);
これは基本的に、すべてのボタンテキストが--global--color-background:
で宣言されたのと同じ色、ミントグリーン(--global--color-green: #d1e4dd
)を使うことを意味する。もし–global–color-green
:のHEXを変更したら、ボタンのテキストも違って見えるでしょう。
注: Twenty Twenty-One子テーマを使用していて変更が見られない場合、style.cssファイルを更新するたびに、テーマファイル情報の「バージョン」部分を更新(例えば、1.0から2.0へ)する必要があるかもしれません。
また、これらのチュートリアルに従って、子テーマのカスタマイズを試すこともできます:
- WordPressで文字色を変更する方法
- WordPressのロゴサイズを変更する方法(どんなテーマでも使える)
- WordPressテーマでBlockquotesのスタイルをカスタマイズする方法
- WordPress Body Class 101: テーマデザイナーのためのヒントとコツ
- WordPressテーマにパララックス効果を追加する方法
ブロックの子テーマをカスタマイズする方法
子ブロックテーマを使用する場合、カスタマイザーのほとんどはstyle.cssではなくtheme.jsonファイルで行います。
しかし、私たちのテストでは、プロセスが複雑であることがわかりました。クラシックな子テーマとは異なり、WordPressのテーマ開発に慣れていない場合、(特にJSONとそこでのCSSの扱い方について)埋めなければならない知識の差が大きくなります。
とはいえ、私たちはCreate Block Themeプラグインを使うことで、もっと簡単な代替手段を見つけた。このツールは、WordPressフルサイトエディターで行った変更を、子テーマ.jsonファイルに記録することができる。そのため、プラグインがあなたの代わりに処理してくれるので、コードをすべて触る必要はない。
例をお見せしましょう。まず、外観 ” エディターから WordPressフルサイトエディターを開きます。
いくつかのメニューが表示されます。
ここでは「スタイル」を選択するだけだ。
次のページでは、いくつかのビルトインスタイルの組み合わせをご覧いただけます。
今回の目的では、すべて省略して鉛筆アイコンをクリックするだけでいい。
では、フォントのような子テーマの一部を変更してみましょう。
この例では、右サイドバーの「Typography」をクリックする。
次に、テキスト、リンク、見出し、キャプション、ボタンのテーマのグローバルフォントを変更するオプションが表示されます。
デモンストレーションのために「見出し」をクリックしてみよう。
フォントのドロップダウンメニューで、元のピックを利用可能な任意のフォントに変更します。
必要に応じて、外観、行の高さ、文字間隔、字体を自由に変更してください。
完了したら、「保存」をクリックするだけです。その後、’Save’の隣にあるCreate Block Themeボタン(レンチのアイコン)をクリックします。
そして、「変更をテーマに保存」をクリックします。
次に、子テーマに保存する変更を選択します。
カスタマイズの例としては、フォント、カスタマイザー、テンプレートの変更などがあります。
サイドバーをすべてスクロールしてください。
その後、『変更を保存』をクリックします。
それでは、コードに反映された変更を確認できるように、theme.jsonファイルを表示してみましょう。
これを行うには、もう一度「ブロックテーマを作成」ボタンをクリックし、「theme.jsonを表示」を選択します。
クリックすると、そのファイルにいくつかの新しいコードが追加されていることがわかります。
この場合、見出しタグはセミボールドのInterフォントを使用し、行の高さは1.2、行間は1ピクセルで、小文字であることを示すコードがファイルに含まれています。
ですから、子ブロックテーマを編集するときはいつでも、レンチアイコンをクリックし、変更を保存するようにしてください。
子テーマのテンプレートファイルを編集する方法
ほとんどのWordPressテーマにはテンプレートがあり、これはテーマ内の特定のエリアのデザインとレイアウトをコントロールするテーマファイルです。例えば、フッターセクションは通常footer.phpファイルで処理され、ヘッダーはheader.phpファイルで処理されます。
WordPressテーマもそれぞれレイアウトが異なる。例えば、Twenty Twenty-Oneテーマには、ヘッダー、コンテンツループ、フッターウィジェットエリア、フッターがある。
テンプレートを修正したい場合は、親テーマのフォルダーにあるファイルを探し、子テーマのフォルダーにコピーする必要がある。その後、そのファイルを開き、必要な修正を加えてください。
例えば、Bluehostを使用していて、親テーマがTwenty Twenty-Oneの場合、ファイルマネージャーで/wp-content/themes/twentytwentyoneに
移動します。そして、footer.phpのようなテンプレートファイルを右クリックし、「コピー」を選択する。
その後、子テーマのファイルパスを入力します。
完了したら、「ファイルをコピー」をクリックするだけです。
その後、ファイル・パスにリダイレクトされます。
footer.phpファイルを編集するには、右クリックして「編集」を選択します。
例として、フッターエリアから「Proudly powered by WordPress」リンクを削除し、そこに著作権表示を追加します。
そのためには、<div class= "powered-by">タグの
間をすべて削除する必要がある:
<div class="powered-by">
<?php
printf(
/* translators: %s: WordPress. */
esc_html__( 'Proudly powered by %s.', 'twentytwentyone' ),
'<a href="' . esc_url( __( 'https://wordpress.org/', 'twentytwentyone' ) ) . '">WordPress</a>'
);
?>
</div><!-- .powered-by -->
次に、下の例のタグの下にあるコードを貼り付ける必要があります:
<div class="powered-by">
<p>© Copyright <?php echo date("Y"); ?>. All rights reserved.</p>
</div><!-- .powered-by -->
テキストエディターで表示される内容は以下の通りだ:
ファイルを保存して、変更を正式なものにする。
その後、あなたのサイトにアクセスして、新しい著作権表示をご覧ください。
子テーマに新規機能を追加する方法
テーマのfunctions.phpファイルは、WordPressサイトに機能を追加したり、デフォルト設定を変更したりするためにPHPコードを使用します。現在のテーマで自動的に有効化したWordPressサイトのプラグインのような役割を果たします。
多くのWordPressチュートリアルでは、functions.phpにコードスニペットをコピー&ペーストするよう求めています。しかし、親テーマに変更を加えると、テーマの更新をインストールするたびに上書きされてしまいます。
カスタム・コード・スニペットを追加する際に子テーマを使用することをお勧めするのはそのためです。このチュートリアルでは、テーマに新しいウィジェットエリアを追加します。
子テーマのfunctions.phpファイルにこのコード・スニペットを追加することで実現できます。このプロセスをより安全にするために、functions.phpファイルを直接編集しないようにWPCodeプラグインを使用することをお勧めします。
詳しくは、カスタム・コード・スニペットの追加方法をご覧ください。
以下は、functions.phpファイルに追加するコードです:
// Register Sidebars
function custom_sidebars() {
$args = array(
'id' => 'custom_sidebar',
'name' => __( 'Custom Widget Area', 'text_domain' ),
'description' => __( 'A custom widget area', 'text_domain' ),
'before_title' => '<h3 class="widget-title">',
'after_title' => '</h3>',
'before_widget' => '<aside id="%1$s" class="widget %2$s">',
'after_widget' => '</aside>',
);
register_sidebar( $args );
}
add_action( 'widgets_init', 'custom_sidebars' );
ファイルを保存したら、WordPressダッシュボードの外観 ” ウィジェットページにアクセスしてください。
ここに、ウィジェットを追加できる新しいカスタムウィジェットエリアが表示されます。
カスタムコードスニペットを使ってテーマに追加できる機能は他にもたくさんあります。WordPressのfunctions.phpファイルに関する非常に便利なトリックや、初心者向けの便利なWordPressコードスニペットをご覧ください。
WordPress子テーマのトラブルシューティング方法
子テーマを作成したことがない場合、いくつかのミスを犯す可能性が高く、それは普通のことです。そのため、バックアッププラグインを使用し、ローカルサイトまたはステージング環境を作成し、デモサイトにダミーコンテンツを使用することをお勧めします。
とはいえ、すぐにあきらめないでください。WordPressのコミュニティはとても機知に富んでいるので、あなたが抱えている問題が何であれ、おそらく解決策はすでに存在しています。
手始めに、WordPressのよくあるエラーをチェックして、解決策を見つけてください。
最も一般的なエラーは、コード内の見落としが原因の構文エラーでしょう。WordPressで構文エラーを見つけ、修正する方法についてのクイックガイドで、これらの問題を解決するためのヘルプを見つけることができます。
さらに、何か大きな問題が発生しても、いつでもやり直すことができます。例えば、親テーマが必須としているものを誤って削除してしまった場合、子テーマからそのファイルを削除してやり直すだけです。
この投稿がWordPressの子テーマを作成する方法を学ぶのにお役に立てば幸いです。また、WordPressテーマを最新の基準に照らしてテストする方法についての究極のガイドや、無料とプレミアムのWordPressテーマの比較記事もご覧ください。
If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.
Jiří Vaněk
A child theme is always the first thing I create on a newly installed site. Although I try to use WP Code a lot and avoid problems, but the child theme is an absolutely brilliant thing when updating a template and can save a lot of trouble with lost code that disappears from the main template after an update.
Asad
Sir, what should I write in function.php to call the Parent theme?
WPBeginner Support
You would want to use the code from our article below the text /* enqueue scripts and style from parent theme */
管理者
Yogesh Sambare
Hi, Team wpbeginner,
Thanks for this awesome guide, now I think I’m able to make my themes child theme, and it’s really helpful for me .
WPBeginner Support
Glad you found our guide helpful!
管理者
Ricardo
The line:
“wp_get_theme()->get(‘Version’) )”
Should be:
“wp_get_theme()->get(‘Version’) )”
cheers!
WPBeginner Support
While our comments automatically changed that in your message, we see the issue, thank you for letting us know
管理者
Rubb
Can I delete the plugin after I create the child theme?
WPBeginner Support
Currently, you can do that with the plugin
管理者
Eitan
You need to add quotation marks to the Y = (“Y”) at the echo date, or you’ll get an error. – echo date(“Y”)
WPBeginner Support
Thank you for pointing out the typo
管理者
Bomo
So now that we have created a child theme, how do we update the parent theme when the child theme is activated?
WPBeginner Support
You would update the parent theme as you normally would. For safety, you may want to create a backup before you update the parent theme in case there is a conflict somewhere.
管理者
RYAD
But do we have to activate the parent theme before we update and them desactivate it and reactivate the child theme ?
WPBeginner Support
No, you can update the theme without it being active