ワードプレステーマTwentyTenのウェジェットタイトルを小綺麗に見やすくする方法です。

テーマTwentyTenのウェジェットタイトルは、デフォルトですとかなり残念ですよね…(汗　超あっさり、黒単色、太文字…orz

ってことで、少しばかり見栄え良くしてみようと思います。それでは、管理画面の「外観」⇒「テーマ編集」から’スタイルシート’を開いて下さい。(小テーマを使用している方は、小テーマ側のスタイルシートを編集して下さい)

スタイルシートの中から、次の部分を探して下さい。

/* =Widget Areas
-------------------------------------------------------------- */

.widget-area ul {
	list-style: none;
	margin-left: 0;
}
.widget-area ul ul {
	list-style: square;
	margin-left: 1.3em;
}
～～～～～～～～　中略　～～～～～～～～
.widget-container .wp-caption img {
	margin: auto;
}
.widget-title {
	color: #222;
	font-weight: bold;
}

↓コレを以下の様に追加/編集して下さい。

/* =Widget Areas
-------------------------------------------------------------- */

.widget-area ul {
	list-style: none;
	margin-left: 0;
}
.widget-area ul ul {
	list-style: square;
	margin-left: 1.3em;
}
～～～～～～～～　中略　～～～～～～～～
.widget-container .wp-caption img {
	margin: auto;
}
.widget-title { /* ウェジェットタイトルの設定 */
	clear: both;
	margin: 0 0 10px 0;
	padding: 2px 8px;
	border-width: 0 0 2px 3px;
	border-color: #444444;
	border-style: solid;
	background: #b91d3a;
	color: #ffffff;
	line-height: 140%;
	font-weight: normal;
}

これで、かなり印象が変わったハズです。数値やカラーコードを自由に編集して、あなた好みのウェジェットタイトルを作成してみて下さい。

参考サイト：見出しメーカー

なお、タイトル文字の大きさ/フォントについては、上記にプラスして次の様に要素を追加/編集して下さい。サイト全体のフォント設定をされて入る方は、個別の設定は必要ありません。

.widget-title { /* ウェジェットタイトルの設定 */
	clear: both;
	margin: 0 0 10px 0;
	padding: 2px 8px;
	border-width: 0 0 2px 3px;
	border-color: #444444;
	border-style: solid;
	background: #b91d3a;
        font-family: お好きなフォント;
        font-size: ◯◯px;
	color: #ffffff;
	line-height: 140%;
	font-weight: normal;
}

素敵なウェジェットタイトルが出来上がったら、ウェジェットをたくさん使いたくなってしまいますね(笑

WordPressデザインブック　ステップバイステップ形式でマスターできる