WordPress個別サポート

BizVektorのヘッダー画像はフレームで囲まれており、「外観」-「テーマオプション」メニューのデザインでDefaultを選択した場合、背景色にテーマカラーが適用されます。

ヘッダー画像の背景色はテーマカラーに

ヘッダー画像の背景色はテーマカラーに

この背景色の塗りつぶしを解除したり、ヘッダー画像の背景色を自由に設定するには、子テーマのstyle.cssなどに次のCSSを記述します。

#topMainBnr { background-color:white; }

ここでは背景色を白(white)に設定しているので次のようなデザインになります。

ヘッダー画像の背景色を白に設定

ヘッダー画像の背景色を白に設定

背景色を透明(transparent)にすれば、結果として背景色が「なし」になります。

#topMainBnr { background-color: transparent; }

表示結果は次のようになります。

ヘッダー画像の背景色を透明に

ヘッダー画像の背景色を透明に

背景色にテーマカラーを適用する設定自体は、bizvektor_themes/001/001_custom.php(デザインでDefaultを選択した場合)にPHPスクリプトで記述されています。

BizVektorバージョン1.0.0でbizvektor_themesフォルダはdesign_skinsフォルダに変更されています。
#topMainBnr { background-color:<?php echo $default_design_options['theme_plusKeyColor'] ?>; }

$default_design_options['theme_plusKeyColor']にテーマカラーの設定が格納されており、ヘッダー画像のbackground-colorに適用される仕組みです。抜本的にカスタマイズしたい場合は参考にしてください。

この記事をSNSで共有する
WordPressでお困りのときはご相談を
この記事を書いた西沢直木が直接、WordPress個別サポートで対応します。
こんなときはご相談を
  • WordPressの使い方(ページやメニューの作り方を教えてほしい)
  • カスタマイズ(機能の追加やデザイン調整をお願いしたい)
  • トラブル対応(画面真っ白・「ログインできない」を解決したい)
マンツーマンなので相談内容は自由です。いただいた課題をその場で解決、CSSやPHPも目の前で修正します。気軽にご相談ください。
WordPress講座の問い合わせ先

関連記事

WordPressカスタマイズ

WordPressによるサイト作成のヒント

WordPressプラグイン

スポンサーリンク
西沢直木によるWordPress講座の紹介
ホームページ作成講座WordPress個別サポート