WEBデザインに役に立つテクニックからWEBデザインに便利なサイト・TIPSの紹介。失敗しないホームページや効果的なWEBデザイン制作方法など紹介します。
ContactForm7のカスタマイズ
Contact Form 7 (日本語) « iDeasiloで配布されているWordPressのメールフォーム作成プラグインContact Form 7は非常に便利なのですが 個人的に気になった部分などを修正・カスタマイズしてみました。
Contact Form 7は非常に柔軟で高性能のメールフォームを作ってくれます。既存のWordPressのメールフォームプラグインなどより拡張性が高いのがいいですね。
WordPress ContactForm7のカスタマイズ
エラーメッセージの部分でマウスオーバーするとチカチカする部分の修正。24行目の
jQuery(this).fadeOut('fast');
の部分を下記のように。
jQuery(this).fadeOut('');
27行目と30行目のfastの部分も同様に消します。
でもってメールフォームでエラーメッセージが出たとき レイアウトが崩れるCSSの変更など。
.wpcf7-not-valid-tip
上記CSSを下記のように変更すると場所を固定できるので 行の下に隙間があかない。
.wpcf7-not-valid-tip {position: absolute; top:24px; right:10px;}
例えばですが このようにするとメールフォームのエラーメッセージが 各フォームの下に相対配置される(デフォルトだと各フォームにspan style="position: relative;が仕込まれているため)のでCSSでそのフォームから見た絶対配置に直してあげます。
ファイルはstylesheet.cssにありますので。
phpなど詳しくないので自己責任でお願いします。個人的なメモでした。
WordPressに欠かせないContact Form 7は下記リンクより。
>Contact Form 7 (日本語) « iDeasilo


