サイドバーを装飾|Simplicity2をカスタマイズ

シェアする

  • このエントリーをはてなブックマークに追加
PAK85_MBAdesagyou20140312_TP_V

サイドバーのタイトルの文字が大きく、味気ない気がして、気になったので変えてみました。

スポンサーリンク

サイドバーのタイトルの装飾

変更したい点は

フォントサイズを少し小さく。背景付(記事を読むと同じ色に合わせたい)で白い文字。

角は丸く、文字は中央寄せに。

ステッチがあったり、可愛い見出しも考えましたが、全体的に、シンプルに統一感をもたせたかったので、丸い背景付にしました。おさえました(^_^;)

Simplicity2 child: スタイルシート (style.css) に下記を追加しました。

#sidebar h3{
text-align:center;
line-height: 24px;
font-size: 18px;
color: #fff;
background-color: #66CDAA;
border-radius: 10px;
padding: 2px 10px;

}

こんな感じになりました。目立ちすぎず、見やすくなったと思います。

のんびりママの気になる木 主婦ブロガーのワードプレスカスタマイズ・アフィリエイト・育児など日記・楽書(5)

今回、こちらのサイト様を参考にしました。

テーマはTwentyTwelveと違いますが、文字の大きさ、高さ、背景、中央寄せなど、ほぼ、希望通りでしたので、コピーして、大きさと色だけ変更しました。

ありがとうございました。

http://affiliate150.com/side-bar-customize

スポンサーリンク

シェアする

  • このエントリーをはてなブックマークに追加

フォローする

トップへ戻る