This page is also available in English.
ユーザーフレンドリーなウェブフォームを構築するにあたって重要なことは、個々の入力項目の目的を明確にすることです。ユーザーを対象にした視覚的なラベリングに加えて、autocomplete
属性を指定することによりブラウザーに項目の目的をプログラムで認識させることが推奨されます。そうすることでブラウザーは過去のユーザー入力に基づいたフォームの自動補完を提供できるようになります。これは単にタイピングの負担が軽減されるので便利だというだけの話ではなく、記憶能力の問題や失読症、その他の障害を持つユーザーにとっては不可欠の要件になります。
Contact Form 7 のいくつかのフォームタグタイプは autocomplete
オプションをサポートします。フォームテンプレート内のフォームタグでこのオプションを指定すると、出力される HTML 要素にオプションの値が反映されます。例として、次のようにフォームタグに autocomplete:name
を追加すると:
[text* your-name autocomplete:name]
出力された HTML 要素は autocomplete="name"
を持つようになり、ブラウザーが自動補完を提供する場合には入力値としてユーザーのフルネームを提案するようになるでしょう。
フォーム要素のレベルで自動補完を設定する
ルート form
要素の autocomplete
属性をカスタマイズするために Contact Form 7 は wpcf7_form_autocomplete
フィルターフックを用意しています。次のコードは form
要素に autocomplete="off"
を設定する例を示しています:
add_filter( 'wpcf7_form_autocomplete', function ( $autocomplete ) {
$autocomplete = 'off';
return $autocomplete;
}, 10, 1 );
form
要素の属性値として許可される値は on
と off
のどちらかだけである点に注意しましょう。それから、form
要素に autocomplete
属性を設定しても個々のフォームコントロール要素の autocomplete
属性によって上書きされてしまいます。ですからこのテクニックが必要になる機会というのはそう多くはないでしょう。