Facebook
RSS Feed
Mar 8, 2012

WordPress初心者講座・Q&A:サイドバーの背景を変更する方法

*このブログではWordPress・HTML・CSS超初心者の方でもカスタマイズ出来るように、
他の人には聞けないようなスーパー基礎の基礎や、ちょっとしたTipsをお伝えしていきます。

こんなご質問をいただきました。

テーマ「Marylou」のサイドバーの色を白にする事はできますか?

「Marylou」のサイドバーは背景色が黒になってます。
でもまあ白もいいですよね。もちろん黄色も。赤もいいかも。
な〜んて感じで色を変えたいという要望ですね。
普通の背景は管理画面から簡単に変更できるんですけど、
サイドバーはCSSをいじれば簡単に変更できますよ。

以下、やり方です。

サイドバーの背景を変更する方法(作業時間20秒)

ダッシュボード>外観>テーマの編集>スタイルシート

例のごとく、スタイルシートを開きます。
この辺いじくるときはバックアップをお忘れなく!

/* ************************************************
* サイドバー
* ************************************************ */

#sidebar {
float: right;
width: 265px;
margin:45px 0px 40px 0px;
padding: 5px 0px 0px 0px;
background:#222;
}

サイドバーって分かりやすく書いてあるところがあるので、
その辺をちょいっと触ります。

background:#222;

見つけましたね〜。
これって前にも書いた気がしますけど、バックグラウンドなんで背景ってことですわね。
#222が黒です。正確にはちょいとした黒ですな。
この数字を白にしたいなら#FFFにすればOK。

逆に、色がついてない他のテーマも、
background:#222;
を追加すれば、好きな背景色が付けられますね。

カラーチャートはネットで検索すると色々出てくるので、
参考にしてみてください。
 
 
それにしても、「WP初心者講座」っていうのと「Q&A」ってのと、
分けて書いてたんだけど、どっちも同じ感じで区別が自分でもつかなくなって来たので、
今後は全部「WP初心者Q&A」ってことでいいですかね。

Posted in Blog, WordPress初心者講座Comments Closed 

関連記事

今月の人気のワードプレステンプレートBEST 3

WordPressテーマ(スマホ対応レスポンシブデザイン)「Slauson」
公式サイト/マガジン/ビジネス・企業
WordPressテーマ(スマホ対応レスポンシブデザイン)White Studio
ビジネス・企業/コーポレートサイト/公式サイト
WordPressテーマ(スマホ対応レスポンシブデザイン)「Pantomime」
ギャラリー・ポートフォリオ / 公式サイト