【Word Press】SWELL:サイトの基本カラーの設定方法

カエルくん

今日はなにを設定しようか?

れい

今日はサイトの基本カラーを設定しよう!

サイトの基本カラーを変更することによって、サイトの印象も変わります。
それほど、色の役割は重要です。
基本カラーを変えて、自分のサイトに合った雰囲気を作りましょう。

目次

基本カラーの設定方法

STEP
カスタマイザーを開く

管理画面の『外観』⇨『カスタマイザー』を開きます。

STEP
サイト全体設定を選択

カスタマイザーが開いたら、『サイト全体設定』をクリックします。

STEP
基本カラーを選択

『基本カラー』をクリックします。

STEP
基本カラーについて
上記はSWELLで最初に設定されている色になります
基本カラーの説明
  1. メインカラー:見出しやボタンなど、サイトで準用となる部分に仕様される色
  2. テキストカラー:サイト全体のテキストの色
  3. リンクカラー:記事本文中のリンクの文字の色
  4. 背景色:ページの背景の色

メインカラーは、本文中の見出しやアイキャッチのカテゴリー表示など、さまざまな箇所で使用されます。
メインカラーでサイトの印象が大きく変わります。

メインカラーに合わせて、テキストカラーやリンクカラーを変更すると統一感がでます。

STEP
色の設定

『色を選択』をクリックし、お好みの色を設定します。

色の設定は、色コードを入力するか、カラーパネルで選択をします。
色の設定ができたら、上部の『公開』をクリックし設定が終わります。

基本カラーの設定後

リンクカラー

カエルくん

色が違うだけで雰囲気がだいぶ変わったね

れい

私は柔らかい印象にしたかったから、ピンクをベースにしてみたよ。
リンクカラーは水色だと浮いちゃう感じだから、茶色っぽい色に変えたよ。

この記事が気に入ったら
いいねしてね!

よかったらシェアしてね!

この記事を書いた人

鹿児島に住んでるシングルマザーです。
40代で会社を辞めてWEBライターに転職を決意しました。
WEBライターになるための活動などを発信していきます。

目次
閉じる