Articles

WordPressテーマの色をカスタマイズする方法

投稿:マーケティング, WordPress by WP Engine

Last updated on December 23rd, 2020

customize wordpress theme colors

customize wordpress theme colors

WordPress を使用する最も良い部分の 1 つは、サイトのスタイルをカスタマイズするために使用できる何千ものテーマを利用できることです。 しかし、完璧なテーマを見つけても、自分の好きな配色でないことに気づくこともあります。

これは悔しいことですが、計画を狂わせる必要はないのです。 この記事では、WordPress テーマの色をカスタマイズする 2 つの方法、手動による方法とプラグインによる方法について説明します。 さっそく始めてみましょう!

WordPressテーマの色を変更する方法

このセクションでは、WordPressテーマの色を手動で変更する方法について説明します。 これを行うには、「子テーマ」を使用します。「親」テーマが更新されたときに行った変更を失わないようにします。

さらに、サイトのフレームワークにカスタム変更を行う予定がある場合は、子テーマを設定することはほとんど常に賢明なアイデアとなります。 415>

Step 1: 子テーマを作成する

子テーマは、親テーマのコピーであり、同じスタイルを継承しています。 親テーマに影響を与えることなくそのコードを変更でき、テーマを更新する必要があるときに上書きされることはありません。 このアプローチにより、サイトのスタイルを安全に編集でき、何か間違いがあれば、親テーマに戻してやり直すことができます。

子テーマを作成する場合、2 つの方法があります。

  1. ファイル転送プロトコル (FTP) を介して、FileZilla などのクライアントを使用して Web サイトに接続します。
  2. Create a new folder for your child theme.
  3. Set up a style.css file for your child theme.

ただし、WordPress ファイルを手動で編集することに抵抗があれば、代わりにプラグインを使用することを選択することができます。 このシナリオでは、Child Theme Configurator をお勧めします。 このプラグインを使用すると、子テーマを生成し、簡単なメニューでその設定を行うことができます。

もちろん、どの方法を使用するかは自由です。 415>

Step 2: WordPressにログインしてカスタマイザーを開く

WordPressのテーマカラーを変更する前に、ダッシュボードにログインする必要があります。 415>

how to customize wordpress themes

how to customize wordpress themes

そこで、子テーマのファイルを変更するためのシンプルなテキスト エディターを見つけます。 FTP とお気に入りのテキストエディタを使用してもできますが、結果は同じです。

加えた変更をライブでプレビューしたい場合は、WordPress カスタマイザーを使用して、テーマの色を編集することもできます。

change wordpress theme colors

change wordpress theme colors

いずれの場合も、テーマの色を変更するには、Cascading Style Sheets (CSS) を使用する必要があります。 そこで、最後のステップに入ります。

ステップ 3: WordPress テーマの色を変更する

このステップは、すでに CSS に慣れている人ならかなり簡単でしょう。 テーマ内の各要素には独自の名前または「クラス」があり、CSS コードを使用してターゲットにすることができます。 たとえば、テーマの背景色を変更する場合、次のような CSS スニペットを子テーマに追加できます (最後のセクションのメソッドのいずれかを使用):

background-color: #XXXXXX;

コードの最初の部分は、変更したい要素の正しいクラスをターゲットにしています。 それから、使用したい HEX カラーを指定する必要があるだけです。

幸い、子テーマを使用しているので、サイトの何かを壊すことを心配することなく、自由に実験することができます。 CSS に慣れていない場合は、サイト内の要素を識別する方法について、このガイドを参照してください。

Plugins That Change WordPress Theme Colors

CSS よりもプラグインを使用したい場合、WordPress テーマの色をカスタマイズするためのいくつかのオプションがあることをご存知でしょうか。 415>

プラグイン 1: 子テーマ設定ツール

change font color in wordpress

change font color in wordpress

子テーマ設定ツールは、子テーマの作成とその配色のカスタマイズができるため、最もお勧めするツールです。 つまり、先に説明した多くのステップをスキップして、カラー パレットの実験をより速く開始できます。 このプラグインを使用すると、フォントの色、背景の色調などを変更できます。

how to change wordpress color scheme

how to change wordpress color scheme

その名前が示すように、Central Color Pallete はテーマのカラー パレットを変更することができます。 このプラグインは、多くの人気のあるテーマやプラグインとうまく統合されており、WordPress エディタを使用して色を選択および切り替えるプロセスを省略することができます。 このプラグインは、多くの人気のあるテーマやプラグインとうまく統合されており、WordPress エディタでの色の選択や切り替えのプロセスを省略することができます。 WP Engine では、その両方の機能と優れたサポート チームを利用できます。

また、トラブルシューティングやウェブサイトの変更に利用できる多くのチュートリアルを公開しています。 私たちのプランをチェックして、試してみてください!