サイドメニューのタイトルの背景色を変更する方法

サイドメニューの色を変更する事で、ブログ全体に統一感が出ます。
初期設定のグレーよりも、ヘッダー画像に合わせた
背景色をつけて全体的にメリハリをもたせましょう。

ブログの配色でメリハリがつくと、サイドメニューの部分が
とても読みやすくなりユーザーフレンドリーなデザインになります。

サイドメニューの部分とはユーザーからすると、
過去の記事を参照したり、カテゴリにジャンプしたりと
とても重要なアクションを起こして頂く場所でもあります。

あなたのアメブロのヘッダー画像の色に合わせて、
この機会に、サイドナビゲーションの色の変更を行ってみてください。

サイドメニューのタイトルの背景色を変更する方法

1. Photoshopで、ヘッダー画像で色のサンプリングを行ってください


2. CSS編集画面で次のように検索をかけます(.skinMenuHeader)


3. ここに、以下のCSSを記述していきます。

.skinMenuHeader{
background: #ここにあなたのアメブロのヘッダー色;
}

サイドメニューのタイトルのフォントの色を変更する方法

フォントの色を変更したい場合は、以下のようにCSSを
記述していきます。

.skinMenuHeader{
color: #fff;
}

記述できましたらプレビューを行って確認してみましょう。
サイドメニューが綺麗にカスタマイズ出来ていると思います。

解決しない場合はakiまでお気軽にコメントくださいね^^


aki