Contact Form 7 でデザインを合わせる方法
Contact Form 7 は、Webデザイナーやプログラマーでないと扱いづらいです。しかし、かなり柔軟に作られています。
デザインを合わせたいときは、
- Contact Form 7 が自動で出力する「クラス名に合わせて、CSSを書く」
- Contact Form 7 のフォーム上でCSSをを書く
- Contact Form 7 が出力するクラスを書き換える（設定する）
などが可能です。
Contact Form 7 が自動で出力する「クラス名に合わせて、CSSを書く」
公式サイトでもリンクされている以下のページが参考になります（英語です）。
あるいは、要素の検証などでチェックして、どのクラスに対して、どのようにCSSを書くかを考えても良いでしょう。
Contact Form 7 のフォーム上でCSSをを書く
要素に対して直接CSSを書くことができます。以下のページをご覧ください。
https://contactform7.com/ja/styling-contact-form/
Contact Form 7 が出力するクラスを書き換える（設定する）
利用しているテーマのスタイルシートを調べて、form 要素などに使っているクラス名や、css を調べて、追加CSSなどで追記しつつ、以下の情報を参考にClassなどを割り当てると良いです。
以下のページが参考になります。
- フォームに対して、IDやクラスをつける
- 送信ボタンに対してIDやクラスをつける
- input要素にClassをつける（class:XXXX と書くだけ）
