ワードプレステーマTwentyElevenのフッターエリアの背景色を変更する方法です。

テーマTwentyElevenの投稿記事内の背景色を変更する方法はコチラ、サイト全体の背景に画像を表示する方法はコチラ、サイドバー/ウェジェットエリアの背景色を変更する方法はコチラをご覧下さい。

こういったパーツ毎に分かれている分色々便利なところがある反面、それぞれに設定を変更する必要があるので、チョッと初心者さんには分かりずらい部分があると思います。

えぇ、私も大変苦労しましたし…(汗　どこをどうやったらそうなる!?みたいな感じでしたよ(笑

でもね、あなたはスグに解決しちゃいます!!

TwentyElevenのフッターエリアはココを変更する!!

それでは、管理画面より「外観」⇒「テーマ編集」より’スタイルシート’を開き、次の部分を見つけて下さい。(小テーマを使用している方は、小テーマ側のスタイルシートを編集して下さい)

/* =Footer
----------------------------------------------- */

#colophon {
	clear: both;
}

～～～～～～～～　中略　～～～～～～～

/* Site Generator Line */
#site-generator {　/* ココです!! */
	background: #f9f9f9;
	border-top: 1px solid #ddd;
	color: #666;
	font-size: 12px;
	line-height: 2.2em;
	padding: 2.2em 0.5em;
	text-align: center;
}
#site-generator a {　/* リンク色 */
	color: #555;
	font-weight: bold;
}

この部分のカラーコードを変更すると、フッターエリアの背景色が変わります。また、あなたのサイトのフッターの表記(サイトタイトルのリンク文字)の変更も可能です。

/* Site Generator Line */
#site-generator {　/* ココです!! */
	background: #お好きなカラーコード;
	border-top: 1px solid #ddd;
	color: #666;　/* フッター部の文字色 */
	font-size: 12px;
	line-height: 2.2em;
	padding: 2.2em 0.5em;
	text-align: center;
}
#site-generator a {　/* リンク色 */
	color: #お好きなカラーコード;
	font-weight: bold;
}
#site-generator a:focus,
#site-generator a hover {　/* マウスオーバー時のリンク色 */
	color: #お好きなカラーコード;
	font-weight: bold;
}

フッターのリンク文字を’太字’にしたくない場合は、’bold’を’normal’に変更すると細字になります。これで、フッターエリアの背景色が変わったハズです。

フッターエリアの色が変わっただけでも、結構テンション上がりますよね?(笑