＜Cocoon＞サイトキーカラーの調整。記事の表示幅（カラム幅）を狭く調整

このサイトはワードプレスのCocoonテーマを利用して制作しています。そのカスタマイズの備忘録です。

色彩、色合いの調整

Fuwari 褐色（かちいろ）スキンに設定

渋くて落ち着きのあるスキンとしてFuwari和色の褐色（かちいろ）を使うことにしました。

各スキンのデザインは自サイトで「Cocoon設定－スキン」で一つ一つチェックできますが、Cocoon公式サイトでサイドバーの「スキン動作デモ」でチェックすると楽です。

サイトキーカラー設定で見出しタグh2の色合いを変更

雰囲気は良いけれどもh2タグとh3タグの区別が付きづらいところを修正したくなりました。

アレコレ試して、h2はサイトキーカラーの変更により背景を桑の実色にしてテキストを白色に変更しました。簡単です。h2タグ以外も色が変わってしまいましたが、キーカラーっていう位だからあちこち影響するのだろうなと思いつつ、ヘッダーフッター含めて見た目ばっちりなので結果オーライです。

追加CSSの設定で見出しタグh3のデザインを変更

h3は追加CSSで背景は白色にして二重線で修飾することで落ち着きました。試行錯誤して以下で落ち着きましたが関連記事やコメントの見出しには反映されておらず、そこはもうあきらめました。

/*h3に左太線と二重下線*/
.main .entry-content h3{
    background: #ffffff;
    border-left: solid 5px #55295b;
    border-bottom: double 5px #55295b;
}

投稿記事の表示幅（カラム幅）の調整

投稿記事の横幅が広すぎて読みづらいので幅を狭くしました。これも簡単にできました。

その後、やっぱり800pxに戻しました。680pxだと一行が短く感じたので。