【MW WP Form】電話番号のカスタマイズ~入力欄のサイズがおかしいのを直す。


お問合せフォームはCONTACT 7 より MW WP Formのほうが好きです。CONTACT 7のほうが手軽で人気のようですが入力確認欄がないのが不安だからです。

MW WP Formを入れてみた。

MW WP Formはショートコードを張り付けるだけでお問い合わせフォームを作成することができます。
今回はその作成方法ではなくちょっと困ったことが起こったのでその解決方法を記録しておきます。

入力欄のサイズがおかしい

使用したテーマはAFFINGERです。調子よく進んでいざ表示させたらこんなことになってしまいました。

電話番号の入力欄が広すぎる・・・・
でも、どこを見てもサイズを設定する欄がない。ということはCSSで設定するしかないようです。

クラス指定とCSS設定

まずはMW Formの設定欄で電話番号のクラス指定をします。


class=”youre_tel”  
これで電話番号のクラス指定ができました。

次はカスタマイズ→追加CSS

.youre telが幅6emと記載。6emはお好みで変えてください。
たぶんAFFINGERで強固な指定がかかっているようで効かなかったので !important を付けました。

なんとか見栄えよくできました。よかった。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です