WordPress(Lightningテーマ)でヘッ ダー、フッターなどの背景を設定する

 Wordpressは簡単にクールなブログやHPを作れるので便利です。数あるテーマの中でも Lightningは HP向きで、仕事のHPもこれで作りました。ただ、不満点の一つは白を基調としており、背景色が設定項目にない点です。

 HTMLなら分かりますが、Wordpress はゴチャゴチャしていてわかりにくいです。そんな疑問にお答えします。

 背景の設定画面を出す

 設定画面はないので、「外観」→「テーマの編集」で直接編集する。

★ functions.phpに以下のコードを記述します(WordPress3.4以上)。

add_theme_support('custom-background');

これ1行を記述するだけで、設定画面が「外観」→「カスタマイズ」に「背景画像」が出てきます。ここでは色は指定で きま せんが、背景画像を設定できます。

 ヘッダーの背景色を設定する。

 style.cssに以下の通り付け加えてください。

 .siteHeader { background-color: #cccccc; box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1); margin-bottom: 0; }

#ccccccが16進で色を表しています。
 ヘッダーに設定できるのは背景画像ではなく、背景色です。


 フッターの背景色を変更する。


ヘッダーと同様に、style.cssに以下のように追加してください。

footer { border-top: 3px solid #337ab7; background-color: #fff8dc;}

#fff8dcを好きな背景色(16進)で変更してくださ い。

コードは「WEB色見本 原色大辞典 - HTMLカラーコード」(http://www.colordic.org /)などを参照のこと。


 どうでしょうか。設定できるのが、背景色か背景画像のどちらか一方になってしまいますが白だけより自由度があが るのではないでしょうか。

 なお、この設定はテーマ・プラグインの更新で上書きされて、白に戻ってしまう可能性があります。その都度書き換える か、更新をしないかは自分で考えてください。


 

  HOME

 

(c)Copyright HAZAWA KEIICHI 2016 All rights reserved