WordPressで子テーマを作成する方法(プログラムおよびプラグイン)

公開: 2020-06-11

サイトのデザインをカスタマイズして、訪問者に印象を与えたいですか? このガイドでは、少しのコーディングとプラグインの両方を使用して、WordPressで子テーマを作成する方法を示します。

カスタマイズはあなたのウェブサイトのデザインの強力な要素です。 あなたはあなたがあなたのウェブサイトを目立たせるのを助けるためにあなたができるすべてをすることを確実にしたいです。 また、WordPressテーマをニーズに合ったデザインで使用することもできますが、デフォルト設定に少しフレーバーを追加すると、はるかにうまくいく可能性があります。 いくつかの背景設定を変更する場合でも、サイトのメガメニューを設定する場合でも。

ただし、Webサイトのカスタマイズは、特にうまく機能するデザインを変更する場合は、かなりの作業になる可能性があります。 そのため、WordPressテーマをカスタマイズする場合は、子テーマを使用することを強くお勧めします。 そして、それが今日のチュートリアルでもたらされるものです。WordPressで子テーマを作成する方法に関する初心者向けのガイドです。

子のテーマとは何ですか?

簡単に言うと、子テーマは、既存の親テーマのデザインと外観を継承する、作成する追加のテーマです。 子テーマは、親テーマのすべての機能と機能も継承します。これらは変更することもできます。

しかし、それが親テーマと同じデザインと機能を持っているのなら、なぜあなたは子テーマが必要なのでしょうか? WordPressで子テーマを作成することにはいくつかの利点があります。 1つは、親テーマからのカスタマイズを分離して、個別にカスタマイズすることです。 たとえば、子テーマのコードに変更を加えることができ、このカスタマイズは親テーマから分離されたままになるため、親テーマのファイルは影響を受けません。

さらに、子テーマを使用する主な利点は、親テーマを更新した後でも、すべてのカスタマイズを保持できることです。 親テーマのカスタマイズに関する大きな問題は、テーマを更新すると、それらの変更が失われることです。 したがって、子テーマでは、スタイル、テンプレート、または関数を変更するかどうかに関係なく、テーマファイルに加えた変更は更新後も保存されたままになります。

開発者は、子テーマを使用して、新しいテーマデザインをすばやく作成することもできます。 子テーマを使用すると、最初から始める必要がなく、テーマのデザインに合わせて親テーマを変更することもできます。

子テーマの利点

要約すると、テーマのカスタマイズの柔軟性を高めたい場合は、子テーマを使用することをお勧めします。 子テーマを使用する場合の主な利点は次のとおりです。

  • 子テーマに対して行ったカスタマイズは親から分離されたままであるため、更新後に元に戻されたり失われたりすることはありません。
  • メインテーマまたはそのファイルを誤って壊すリスクはありません。
  • 開発者は、子テーマと親テーマを使用して、柔軟なテーマデザインとテーマフレームワークを作成することにより、開発時間を節約できます。
  • 子テーマは非常に軽量であり、子テーマを無効にするか削除するだけで、いつでも変更を元に戻すことができます。

子テーマの使用を検討する理由を説明したので、WordPressで子テーマを作成する方法を見てみましょう。

WordPressで子テーマを作成する方法

WordPressで子テーマを作成する主な方法は2つあります。

  1. プラグインを使用する
  2. プログラムで

どちらの方法にも長所と短所があるため、スキルとニーズに最も適した方法を使用してください。

1)WordPressプラグインを使用して子テーマを作成します

プラグインを使用して子テーマを作成するのが最も簡単で初心者に優しい方法です。 プラグインをインストールし、あちこちでいくつかのボタンをクリックするだけで、準備完了です。 そして、非常に使いやすい子テーマプラグインがたくさんあります。

このガイドでは、Child ThemeGeneratorプラグインを使用します。 他のオプションを確認したい場合は、最高のWordPress子テーマプラグインのリストを確認することをお勧めします。

どちらのアドオンを使用するかを決定したら、それをインストールする必要があります。 したがって、 WP管理ダッシュボードを開き、プラグインにカーソルを合わせて、[新規追加]をクリックします。 次に、右上の検索バーを使用して、インストールしようとしているプラ​​グインを検索します。 子テーマジェネレータをインストールします。

WordPressで子テーマを作成する-プラグインタイトル

次に、必要なプラグインをインストールします。 インストールが完了したら、 Activateを押します。 または、サイドバーの[プラグイン]> [インストール済みプラグイン]に移動して、プラグインをアクティブ化/非アクティブ化することもできます。

WordPressで子テーマを作成します-プラグインをインストールします

子テーマジェネレータプラグインを使用して子テーマを作成する方法

プラグインをインストールしてアクティブ化したら、 [設定] > [子テーマの生成]をクリックして、プラグインのインターフェイスを開きます。

WordPressで子テーマを作成する-プラグインインターフェース

次に、[新規作成]タブで、子のテーマに関するさまざまな詳細を入力できます。

親テーマとして必要なテーマを選択し、テーマの見出し、説明、子テーマのURL、作成者、およびその他のテーマの詳細を追加するだけです。 ここでは、テーマファイルと一緒にGNUGPLライセンスを追加することもできます。

完了したら、[新しい子テーマの作成]をクリックすると、入力した詳細に基づいて子テーマが作成されます。

次に、 [外観]> [テーマ]に移動し、新しく作成した子テーマを選択してアクティブ化することで、変更またはアクティブ化できます。

それでおしまい! 子テーマを作成しました。 これで、カスタマイズして、必要なすべての変更を加えることができます。

それでは、プラグインを使用せずにプログラムで子テーマを作成する方法を見てみましょう。

2)プログラムで子テーマを作成する

プラグインをインストールしたくない場合は、プログラムでWordPressの子テーマを作成できます。 これには少しコーディングが必要ですが、初心者でも非常に簡単です。 あなたがする必要があるのはあなたの子テーマのフォルダを作成し、その中にいくつかのファイルを作成することです。

親テーマをアクティブ化する

したがって、最初に、Webサイトで子テーマを作成する親テーマをアクティブ化する必要があります。

次に、WebサイトのWebホスティングコントロールパネルを使用して、サーバーフォルダーにアクセスする必要があります。 パネルのファイルマネージャーまたはFTPクライアントを使用して、サイトのテーマフォルダーを開く必要があります。 これはpublic_html / wp-content / themesの下にあります。

ステップ

テーマのフォルダを見つけたら、次の簡単な手順に従います。

1)子テーマの名前でthemesディレクトリ内にフォルダを作成します。 今のところ、デモチャイルドテーマを使用します。 親テーマの名前の後に子サフィックスを付けて、管理しやすくすることもできます。 たとえば、 Flash-ChildまたはBlacklite-Childです。

2)次に、style.cssファイルを作成し、 style.CSSファイル内に次のコードをコピーします。

 / *
テーマ名:デモ子テーマ
テンプレート:ブラックライト
テーマのURL:Quadlayers.com/blog
説明:デモの子のテーマ
テーマの作者:Quadlayers
著者のURL:Qualayers.com
バージョン:1.0.0
* /

これはスタイルシートと呼ばれます。 お子様のテーマのこの情報を変更することを忘れないでください。 コードの各行のコロンの後に情報を追加するだけです。 ここで最も重要な部分は、一意である必要があるテーマ名と、使用している親テーマを指定する必要があるため、使用しているテンプレートの名前です。

3)次に、子テーマフォルダー内にFunctions.phpという名前のファイルを作成し、次のコードをコピーします。

 <?php
add_action( 'wp_enqueue_scripts'、 'enqueue_parent_styles');
関数enqueue_parent_styles(){
wp_enqueue_style( '親スタイル'、get_template_directory_uri()。 '/ style.css');
}
?>

4)両方のファイルを保存してから、 [ダッシュボード]> [外観]> [テーマ]に移動します。 Style.CSSフォルダーに挿入した説明を含む新しい子テーマが表示されます。

これが、WordPressでプログラムで子テーマを作成する方法です。 それでは、カスタマイズする方法を見てみましょう。

WordPressの子テーマをカスタマイズする方法は?

このセクションでは、子テーマの外観をより深いレベルでカスタマイズするために何ができるかを見ていきます。 1つは、CSSを少し使用してフォント設定と背景色を変更してみましょう。

テーマCSSをカスタマイズする

まず、[外観] > [カスタマイズ]に移動して、テーマカスタマイザーを開きます。 次に、サイドバーメニューの[追加のCSS ]をクリックします。

WordPressで子テーマを作成する-カスタマイザー

ここで、テーマ設定を直接上書きするCSSコードを追加できます。 たとえば、次の小さなコードを追加できます。

 p {
色:灰色;
}
p {
フォントファミリー:Helvetica;
フォントサイズ:18px;
}

そして、その小さなコードスニペットを挿入すると、Liveカスタマイザーに変更が表示されます。 もう少し色が必要なので、サイトのウィジェットバーの背景色を変更しましょう。

 .widget {
背景:#00FFFF;
パディング:25px;
}

次に、コードを1行追加して、「PoweredbyWordPress」の著作権フッターを削除しましょう。

 .site-info {表示:なし; }

これで、CSSを少し使用して子テーマをカスタマイズしました。 これは、これらの変更の表面を引っ掻いているだけです。 できることはもっとたくさんあります。

テーマFunctions.phpファイルをカスタマイズします

[外観] > [テーマエディタ]に移動すると、テーマファイルを直接カスタマイズできます。 次に、 Functions.phpファイルをクリックして、テーマにカスタム関数を追加します。

WordPressで子テーマを作成する-関数

たとえば、Webサイトの右クリックを無効にするには、次のコード行をFunctions.phpファイルに追加します。

 function your_function(){
?>
<スクリプト>
jQuery(document).ready(function(){
jQuery(document).bind( "contextmenu"、function(e){
falseを返します。
});
});
</ script>
<?php
}
add_action( 'wp_footer'、 'your_function');

次に、[ファイルの更新]をクリックします。

最後に、何かを台無しにした場合は、子テーマを削除して新しいテーマを作成し、親テーマに影響を与えることなく最初から始めることができます。

結論

全体として、子テーマを作成してカスタマイズすることで、あらゆる種類のWordPressユーザーにテーマ変更のまったく新しい道が開かれます。 それについての最もよい事はあなたがあなたのテーマを台無しにしたかもしれない何でも元に戻すことができるのでそれが提供する柔軟性です。 さらに、すべてのカスタマイズは親テーマから分離されたままであり、更新後に失われることはありません。 したがって、子テーマを作成し、それを試してサイトを改善することを強くお勧めします。

これは複雑に聞こえるかもしれませんが、そうではありません。 必要なのは、テーマファイルに少しコードを追加し、いくつかのフォルダーを管理することだけです。

ただし、すべてのユーザー、特に初心者がプログラムで子テーマを簡単に作成および作成できるとは限りません。 その場合は、プラグインを使用してテーマを作成できます。 いずれかの時点で問題が発生した場合は、コメントを残してください。すぐに対応します。

最後に、テーマをさらにカスタマイズしたい場合は、フッターを編集する方法とWordPressでヘッダーをカスタマイズする方法に関するガイドを確認してください。