Cocoonでカラーを設定する方法

ブログ

ブログをカスタマイズする際にやはり気になるのは、カラー設定です。ここではCocoonでカラー設定を変更する方法を紹介します。

サイトのキーカラーの設定

まずは、サイトのキーカラーの設定方法です。
サイトのキーカラーは、見出しなどの色に用いられます。

WordPressのダッシュボードメニューの左側にある「Cocconの設定」をクリックします。

次に、タブの中から「全体」を選択します。
全体設定

少しスクロールすると、「キーカラー」という項目があります。

キーカラー

ここに設定したい色を入力、もしくは、パレットから選択します。

カラー設定

サイトのテキストカラー設定

サイトのテキストカラーは黒でもいいですが、完全な黒よりは、限りなく黒に近い色がいいといわれます。
サイトのフォントカラーはサイト全体で使用されるキーテキストカラーとサイトフォントの文字色設定の2つがあります。
違いがわからないと思いますので、実際に変更して、確認してみました。
わかりやすくキーカラーを黄緑、サイトフォントを赤にした場合です。
サンプル
サンプル2

タイトルや本文はサイトフォントの赤になる一方で、
h1の見出しやサイドバーのメニューの文字、カテゴリーの文字などは、サイトキーテキストカラーの黄緑になりました。

こだわりがなければ、黒に近い#3C3C3Cなどを設定しておくのがおすすめです。

サイトキーテキストカラーは、キーカラーの下で設定できます。
サイトキーテキストカラー

サイトフォントの文字色は、キーカラーの下にあるサイトフォントの項目にあります。
サイトフォントカラー

その他のカラー設定

その他にも文字選択時のカラー設定などを変更できます。
先ほどの「全体」の項目をさらにスクロールすることで、変更できます。
– サイトリンク色:サイトで利用されるリンク色を選択します。
– サイト選択文字色:サイト内のテキストを選択した際の文字色です。
– サイト選択背景色:サイト内のテキストを選択した際の背景色です。
その他の項目

タイトルとURLをコピーしました