TwentyTwelve フッター上の細い線(グレーの線)を消す

ワードプレステーマTwentyTwelveで、フッター上の線(サイトコンテンツとフッターの境目)を消す方法です。

個人的には、サイトコンテンツとフッターとの境目になるのであっても良いとは思っています。ただし、サイト構成上や見栄えよっては、不必要な場合があるでしょう。

今回は、フッター上部の細い線(グレーの線)を撤去したいと思います。

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

/* Footer */
footer[role="contentinfo"] {
	border-top: 2px solid #ededed;  /* ココです!! */
	clear: both;
	font-size: 14px;
	font-size: 0.957142857rem;
	line-height: 1;
	max-width: 960px;
	max-width: 68.571428571rem;
	margin-top: 12px;
	margin-top: 1.714285714rem;
	margin-left: auto;
	margin-right: auto;
	padding: 24px 0;
	padding: 1.714285714rem 0;
	background: #F9F3EC;
}

基本的に、サイト上のこういった線って言うのは、’border’指定されている場合がほとんどです。他の場所でも気になる箇所があれば、そう言った箇所を見つけてみましょう。

これを、下記の様にコメント扱いにすればOKです。もちろん、その行を削除してもOK。ただしその場合は、小テーマを作成してからの方が良いでしょう。

/* Footer */
footer[role="contentinfo"] {
	/* border-top: 2px solid #ededed; */  /* ココです!! */
	clear: both;
	font-size: 14px;
	font-size: 0.957142857rem;
	line-height: 1;
	max-width: 960px;
	max-width: 68.571428571rem;
	margin-top: 12px;
	margin-top: 1.714285714rem;
	margin-left: auto;
	margin-right: auto;
	padding: 24px 0;
	padding: 1.714285714rem 0;
	background: #F9F3EC;
}

おぉ~っ!!ものすごく簡単でしたねぇ♫これで、フッター上の細い線が消えたハズです。

ちなみに、一番下の’background’のカラーコードを変えると、フッターエリアの背景色が変わります。

こういった細かいところがクリアになると、かなりテンション上がっちゃいますよね(笑

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

 

にほんブログ村 ブログブログ ブログノウハウへ