Wordpress

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

  • このエントリーをはてなブックマークに追加
  • Pocket
  • LINEで送る

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

当ブログでも使用している問い合わせフォームのプラグイン[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;
}

  • このエントリーをはてなブックマークに追加
  • Pocket
  • LINEで送る

ブログ記事について

ブログ記事は基本、毎週月曜日午前中に発信!(ニュース関連については随時)
記事に価値があると感じましたら、応援をお願いいたします!

公式ホームページについて

当ブログではITエンジニア関連のテクニカルな事、そして様々な商品のレビュー記事を公開しています。
一方ホームページでは、それ以外の少しビジネス寄り(企業や個人事業主向け)のサービスや情報を発信します。

該当される方、ご興味のある方はホームページの方もご参照ください。

コメントを残す

*