【Cocoon】超初心者向け!見出しの色だけ変えたい時の設定方法

Cocoon

はーい!ままん(@maman_selfish)です。

先日、ゴリゴリ見出しカスタマイズする際に気をつけることについての記事を書きましたが

CSSいじるのめっちゃ怖いねん・・・
でも・・・せめて色くらいはどうにかできひんやろか?

という方もいらっしゃいますよね。

ということで、Cocoonの基本設定だけで簡単にできる(非CSS)見出しデザインについても書いておくことにします。

参考 【初心者向け】Cocoonの見出しカスタマイズでの注意点

【初心者向け】Cocoonの見出しカスタマイズでの注意点
カスタマイズの登竜門とも言えるのが見出しのカスタマイズ。この記事では、カスタマイズ初心者の方向けに無料テーマCocoonの見出しカスタマイズでの注意点をまとめています。
スポンサーリンク

Cocoonのデフォルト見出しデザイン

ちなみに、デフォルトの見出しについては以下のようなデザインです。

h2のデフォルト見出し

h3のデフォルト見出し

h4のデフォルト見出し

h5のデフォルト見出し

h6のデフォルト見出し

なんの設定もせずに、Cocoonをインストールして設定を変えずに記事を書くとこんなデザインになります。

スポンサーリンク

デザインはこれでいいけど色だけ変えたい

あれ?色がちょっとアレだけど・・・
デフォルトのデザインもシンプルで結構よくない!?

という方もいらっしゃるかもしれませんね。

そういう場合は、【Cocoon設定】の【全体】タブにある【サイトキーカラー】を設定すればデザインを変えずに色のみ変更することができますよ。

カラーコードを設定することで、見出しのデザインは変えずに自分好みの色に変更することができます。

下記のサイトなどを参考にしてご自分の好みの色を指定してくださいね。

参考 原色色見本

WEB色見本 原色大辞典 - HTMLカラーコード
色の名前とカラーコードが一目でわかるWEB色見本
注意この部分を設定すると、サイドバーの見出しなどもここで指定した色に変わります。
ブログのメインになる色ですので、色々試してみてもいいですね。
スポンサーリンク

まずは設定でできることから始めよう

わたしは過去に何度もブログの立ち上げをしていて、Cocoonを使うのは初めてでも、CSSカスタマイズ自体に慣れています。

でも、ブログを始めたばかりの方はCSSに書き込むこと自体がちょっとした冒険なんですよね。

まだちょっとCSSは早いかな・・・

という方はぜひ、設定からできる部分でのカスタマイズから初めてみるといいですよ。

少しずつ、ご自分の個性が溢れる素敵なブログに育てていきましょう!

コメント