[WordPress]プラグインContact Form 7の色変更

標準の問い合わせフォームの色変更

当ブログでも使用している問い合わせフォームのプラグイン[Contact Form 7]の文字色変更の方法です。
標準の色設定ではテーマによってフォームが見にくくなってしまいますので、今回は色の変更方法について簡単にメモしておきます。

ブログ本体のCSS追加で変更

最初[Contact Form 7]のプラグインのCSSを直接変更しようと思いましたが、
プラグインの更新等で上書きされて初期化されるの懸念もありますので、本体のCSSの追加で行いました。

CSSの追加例

・各項目の文字色
.wpcf7 .required {
color: white;
}
各項目の変更したい文字列に、spanタグで設定できます。
＜span class=”required”>お名前 (必須)

・エラーメッセージの文字色
.wpcf7 span.wpcf7-not-valid-tip {
color: red;
}

・メッセージボックスの文字色
.wpcf7 .wpcf7-response-output {
color: white;
}