MENU
Wordprss

Contact Form 7の送信ボタンの大きさ・色と文字大きさのカスタマイズ

ouyun

お問い合わせのページは「ContactForm7(コンタクトフォーム)」というプラグインを使うと便利です。しかし、Contact Form 7を使ってお問い合わせフォームを作ったのですが、「送信ボタン」のカスタマイズで、大きさは変わるものの、なぜかボタンの色と文字の大きさが変わらない!という問題に直面しました。

試行錯誤した結果、以下はそのカスタマイズの方法になります。

追加CSSで下記のコードを入力ください。

.wpcf7 input[type=”submit”] {
width:100%;
padding:10px;
border-radius:10px;
-webkit-border-radius: 15px;  
-moz-border-radius: 15px;
border: none;
box-shadow: 0 6px 2 #ddd;
background: #a9a9a9;
transition: 0.6s;
font-size:25px;
}

上記のブルーで塗りつぶしした部分の色の指定コードは16進数のカラーコードをご参照ください。

ピンクのマーカー部分は文字の大きさを変更する値になります。

黄色のマーカー部分はボタンの大きさを変更できます。

そしたら、下記の通り変更できました!

ご参考になれば幸いです。

ABOUT ME
ouyun
ouyun
はじめまして。あゆと申します。 中国から日本に来て早20年、専業主婦→アルバイト→契約社員→正社員を経って現在はフリーランスで働きながら、家事、育児、資産運用もこなして、更に多様な趣味を楽しんでいます。 これは私のサイトです。 自分の経験から色々得た知恵をシェアできたらと思います。 いっちゃん様という名前の世界一かわいい猫を飼っています。 好きなことは人間観察です。 家族5人と2匹で平凡な生活を送っています。 わたしのサイトが少しでもみんなさんのお役に立てれば幸いでございます。
記事URLをコピーしました