毎週末は家族サービスデイなので、ブログの更新はできませんでしたが
またXeoryのカスタマイズをしていきましょうね。

と言っても、さっきまで寝てたので、style.cssの変更だけでササっとできるやつをw

サイドバーのウィジェットのタイトルに背景色を付ける

サイドバーのタイトル文字の背景に、色をつけてみました。
それに伴い、文字の色も白に変更。

もともとこんなんで、なんかメリハリないですよね。
sidebar

で、こんな感じになりました。
sidebar1

/* —————————————-
* side
—————————————- */
.side-widget-area {
padding: 0;
}

.side-widget {
margin-bottom: 40px;
padding-bottom: 40px;
line-height: 1.6;
font-size: 14px;
}
.side-widget .side-title {
margin: 0 0 32px;
font-size: 15px;
}

この記述のところに

.side-widget .side-title {
margin: 0 0 32px;
font-size: 15px;
color: #ffffff;/*変更部分:文字色のカラーコード*/
background-color: #2897cf;/*変更部分:メニューの背景カラーコード*/
border-radius: 3px;
padding: 2px 10px;
margin: 0
}

このコードを加えます

スポンサーリンク

 

border-radius っていうのは、角の丸いところです。
数字が大きければ大きいほど、角が丸くなってきます。
これはお好みで。

 

文字を太くしたければ
font-weight: bold;
っていうのを付け加えてください。

文字の色だけ変更したかったら

background-color: #2897cf;/*変更部分:メニューの背景カラーコード*/
border-radius: 3px;
padding: 2px 10px;
margin: 0

これは削除して、文字色のカラーコードだけ変更してください。

文字の大きさなどもここで変更できます。

間違いようがないところなので、簡単にできますよ!

時間があれば、もっと細かな変更を追記したいと思います。