TOMOIKU*ブログ
4.62016
賢威ヘッダーのカスタマイズ背景画像の削除と背景色の変更でオリジナル性を!
賢威はカスタマイズをしなくても、すぐにでも出来上がるのが魅力なのですが、初期設定をしてあるデザインや画像の変更は、やはり個性をだしたいものです。
まして一番目につくヘッダーのデザインとなると、こだわりたい方もいるのでは?
賢威はいくつかの基本デザインがあり、そのデザインを選んでからダウンロードをして使用します。
見出しのデザインはコチラがいいけど…ヘッダーのデザインがなぁ~と悩まなくても、ある程度は理想の形ができますよ!
例として、ヘルシー版の「ヘッダーの葉」を削除して無地にしたいと思ったので、削除方法です。
ヘルシー版の葉っぱを削除する方法
すっきりと葉の画像がなくなりました。 |
ワードプレスのダッシュボード→外観→エディター(テーマの編集)→design.css
cssやphpを変更する場合、変更するソースの指定位置を探す時は、右上の検索窓を出して探してください。 マックの場合 command+F Windowsの場合 ctrl+F …で、右上検索窓ができます。検索窓で url(./images/common/bg-header.jpg) center top repeat-x と入力すると、背景画面がカラーになって表示されます。url(./images/common/bg-header.jpg) center top repeat-x は、葉の背景画像を指しているので、その部分を削除してください。 |
ヘッダーの画像の変更と背景色を変更
背景画面の変更 | 背景色の変更 |
【背景画像の変更】
ヘッダーの葉の画像から加工済みの画像に変更する場合、画像は幅1500xp以上を用意するか、パターン画像を用意してください。
h1に入れ込む画像変更ではなく、タイトルのヘッダーテキストを利用する場合の背景画像の変更です。
メディアライブラリの詳細から画像のURLをコピーして緑のラインのカッコ内 ./images/common/bg-header.jpg を削除して (画像URL)に変更してください。
上記画像赤い枠 url(./images/common/bg-header.jpg) center top repeat-xを削除して 青い文字部分♯fffに好きなカラーコードを入力してください。
以上ヘッダーの背景画像削除・背景画像の変更・背景色の変更 3点のカスタマイズでした。
ヘッダーのデザインが、運営者を表す「顔」です。
苦労しても、いろいろカスタマイズしてみる価値があります。
<健康を意識した目的別レシピ>
生活を彩る 関連記事
* TOMOIKUの姉妹サイト紹介 *