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

基本的には、TwentyTenもElevenも似た様な箇所/部分がありますので(CSSスタイルシート)、そこを追加/編集する事でフォント(字体)や色/リンク色などを変更する事が出来ます。

また、同じ箇所でフッターエリアの背景色などの変更も出来ます。また、フッターエリアの上の細い線の色変更や、線字体を消す事も出来ますよ。

TwentyTwelveのフッターエリアはココ!!

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

/* Footer */
footer[role="contentinfo"] {　/* フッターエリアの設定 */
	border-top: 1px solid #ededed;
	clear: both;
	font-size: 12px;
	font-size: 0.857142857rem;
	line-height: 2;
	max-width: 960px;
	max-width: 68.571428571rem;
	margin-top: 24px;
	margin-top: 1.714285714rem;
	margin-left: auto;
	margin-right: auto;
	padding: 24px 0;
	padding: 1.714285714rem 0;
}
footer[role="contentinfo"] a {　/* リンク色の設定 */
	color: #686868;
}
footer[role="contentinfo"] a:hover {　/* マウスオーバー時の色 */
	color: #21759b;
}

この部分ですね。デフォルトですとテキスト文字はありませんよね。WordPressへのリンクがあるだけです。この文字色を変える場合は、テキスト色を変えるのではなく、リンク色の方を変えないと変更できません。

/* Footer */
footer[role="contentinfo"] {　/* フッターエリアの設定 */
	border-top: 1px solid #ededed;
	clear: both;
	font-size: 12px;
	font-size: 0.857142857rem;
	color: #カラーコード;　/* 文字色の変更 */
	line-height: 2;
	max-width: 960px;
	max-width: 68.571428571rem;
	margin-top: 24px;
	margin-top: 1.714285714rem;
	margin-left: auto;
	margin-right: auto;
	padding: 24px 0;
	padding: 1.714285714rem 0;
}
footer[role="contentinfo"] a {　/* リンク色の設定 */
	color: #686868;
}
footer[role="contentinfo"] a:hover {　/* マウスオーバー時の色 */
	color: #21759b;
}

フッターエリアにテキスト文字を挿入する場合の文字色変更は、緑の部分のカラーコードを追加すればOKです。

リンク色を変更したい場合は青の部分のカラーコードを、マウスオーバー時のリンク色の変更は赤の部分のカラーコードをそれぞれ変更すればOKです。

今はこぉ、サクサク書いていますが、初心者の方にとってはチトややこしいですかね?基本、黒い文字のところは’イジらない’で、色が変わったところだけ追加/編集すれば問題なくカスタマイズ出来るようには表現しています。

最初慣れないうちは、とりあえずコピペして変更してみてサイト表示させてみて下さい。そうするとね、ダンダン分かってくると思いますよ☆