WordPress の Contactform7 のcheckbox(チェックボックス)/radio(ラジオボタン)をユーザに優しくする

contactform7のチェックボックス・ラジオボタンは、選択するときに小さい□とか○をピンポイントでクリックしなければならず、使いづらい。

これは標準だと<label>が出力されないためで、改善するには単純に<label>で囲ってあげればよい。

試しにこんなコードはいかがでしょう。

(function($){
$('.wpcf7-checkbox .wpcf7-list-item').wrap($('<label />'));
})(jQuery);

ついでに、標準だとすべて一行につながって表示されてしまって見づらいのも直してみた。

(function($){
$('.wpcf7-checkbox .wpcf7-list-item').css({'display':'block','float':'left'}).width('33%').wrap($('<label />'));
}(jQuery);

Leave a Reply