フィールドタイプの説明と使い方
FormNestで利用可能なすべてのフィールドタイプについて、詳しい説明と使い方を解説します。各フィールドの特徴、設定項目、使用例を確認して、最適なフォームを作成しましょう。
フィールドタイプ一覧
FormNestでは、以下の16種類のフィールドタイプが利用できます:
- テキスト
- メールアドレス
- 電話番号
- URL
- テキストエリア
- 数値
- 日付
- セレクトボックス
- ラジオボタン
- チェックボックス
- ファイル
- 郵便番号
- 都道府県
- 市区町村
- 確認用メールアドレス
- 同意チェック
- 隠しフィールド
テキスト入力系フィールド
1. テキスト
用途: 1行のテキスト入力に使用します。名前、タイトル、会社名など、短いテキストの入力に適しています。
主な設定項目:
- フィールド名:内部識別用の名前(英数字とアンダースコアのみ)
- フィールドラベル:ユーザーに表示されるラベル
- 必須項目:必須かどうか
- プレースホルダー:入力例を表示
- 最大文字数:入力可能な最大文字数
- 最小文字数:入力が必要な最小文字数
- 文字種制限:半角英数、半角数字、半角英字、ひらがな、カタカナなど
- 説明文:フィールドの下に表示される補足説明
使用例:
- お名前:フィールドラベル「お名前」、必須項目、プレースホルダー「山田太郎」
- 会社名:フィールドラベル「会社名」、任意項目、最大文字数50
- ユーザーID:フィールドラベル「ユーザーID」、必須項目、文字種制限「半角英数」
💡 ヒント: 文字種制限を設定することで、入力ミスを防ぐことができます。例:ユーザーIDには「半角英数」、電話番号には「半角数字」を設定。
2. テキストエリア
用途: 複数行のテキスト入力に使用します。お問い合わせ内容、コメント、備考など、長い文章の入力に適しています。
主な設定項目:
- フィールド名:内部識別用の名前
- フィールドラベル:ユーザーに表示されるラベル
- 必須項目:必須かどうか
- プレースホルダー:入力例を表示
- 行数:表示される行数(デフォルト:4行)
- 最大文字数:入力可能な最大文字数
- 最小文字数:入力が必要な最小文字数
- 説明文:フィールドの下に表示される補足説明
使用例:
- お問い合わせ内容:フィールドラベル「お問い合わせ内容」、必須項目、行数5、最大文字数1000
- 備考:フィールドラベル「備考」、任意項目、行数3、最大文字数500
- ご意見・ご要望:フィールドラベル「ご意見・ご要望」、任意項目、行数6
💡 ヒント: 行数を適切に設定することで、ユーザーが入力しやすいフォームになります。長い文章を想定する場合は、行数を多めに設定しましょう。
メール・連絡先系フィールド
3. メールアドレス
用途: メールアドレスの入力に使用します。自動的にメールアドレスの形式をチェックします。
主な設定項目:
- フィールド名:内部識別用の名前(通常は
email) - フィールドラベル:ユーザーに表示されるラベル
- 必須項目:必須かどうか
- プレースホルダー:入力例を表示(例:example@email.com)
- 説明文:フィールドの下に表示される補足説明
バリデーション:
- 自動的にメールアドレスの形式をチェック
- @マークが含まれているか
- ドメイン部分が正しい形式か
使用例:
- メールアドレス:フィールドラベル「メールアドレス」、必須項目、プレースホルダー「example@email.com」
- 連絡先メールアドレス:フィールドラベル「連絡先メールアドレス」、必須項目
💡 ヒント: メールアドレスフィールドは、自動返信メールの送信先として使用されます。必ず必須項目に設定することを推奨します。
4. 確認用メールアドレス
用途: メールアドレスの再入力確認に使用します。入力ミスを防ぐために使用します。
主な設定項目:
- フィールド名:内部識別用の名前(通常は
email_confirm) - フィールドラベル:ユーザーに表示されるラベル(例:「メールアドレス(確認用)」)
- 必須項目:通常は必須
- プレースホルダー:入力例を表示
- 確認対象フィールド:確認対象となるメールアドレスフィールドを選択
バリデーション:
- 確認対象のメールアドレスフィールドと一致するかチェック
- メールアドレスの形式もチェック
使用例:
- メールアドレス(確認用):フィールドラベル「メールアドレス(確認用)」、必須項目、確認対象「メールアドレス」フィールド
💡 ヒント: 重要なフォームでは、メールアドレスの入力ミスを防ぐために確認用フィールドを追加することを推奨します。
5. 電話番号
用途: 電話番号の入力に使用します。日本の電話番号形式に対応しています。
主な設定項目:
- フィールド名:内部識別用の名前(通常は
tel) - フィールドラベル:ユーザーに表示されるラベル
- 必須項目:必須かどうか
- プレースホルダー:入力例を表示(例:090-1234-5678)
- 説明文:フィールドの下に表示される補足説明
バリデーション:
- 日本の電話番号形式をチェック
- ハイフンあり・なしの両方に対応
使用例:
- 電話番号:フィールドラベル「電話番号」、任意項目、プレースホルダー「090-1234-5678」
- 携帯電話番号:フィールドラベル「携帯電話番号」、必須項目
💡 ヒント: 電話番号は任意項目にすることが多いですが、連絡が必要な場合は必須項目に設定しましょう。
URL・数値系フィールド
6. URL
用途: ウェブサイトのURL入力に使用します。http://やhttps://で始まるURLを自動チェックします。
主な設定項目:
- フィールド名:内部識別用の名前(通常は
url) - フィールドラベル:ユーザーに表示されるラベル
- 必須項目:必須かどうか
- プレースホルダー:入力例を表示(例:https://example.com)
- 説明文:フィールドの下に表示される補足説明
バリデーション:
- URLの形式をチェック
- http://またはhttps://で始まるか
使用例:
- ウェブサイトURL:フィールドラベル「ウェブサイトURL」、任意項目、プレースホルダー「https://example.com」
- ブログURL:フィールドラベル「ブログURL」、任意項目
7. 数値
用途: 数値のみの入力に使用します。年齢、数量、金額など、数値データの入力に適しています。
主な設定項目:
- フィールド名:内部識別用の名前(通常は
number) - フィールドラベル:ユーザーに表示されるラベル
- 必須項目:必須かどうか
- 最小値:入力可能な最小値
- 最大値:入力可能な最大値
- 小数点:小数点の入力を許可するか
- マイナス値:マイナス値の入力を許可するか
- プレースホルダー:入力例を表示
バリデーション:
- 数値のみの入力をチェック
- 最小値・最大値の範囲内かチェック
- 小数点の有無をチェック
- マイナス値の有無をチェック
使用例:
- 年齢:フィールドラベル「年齢」、必須項目、最小値0、最大値120、小数点なし、マイナス値なし
- 数量:フィールドラベル「数量」、必須項目、最小値1、最大値1000、小数点なし
- 金額:フィールドラベル「金額」、必須項目、最小値0、小数点あり
💡 ヒント: 年齢や数量など、整数のみの場合は小数点を無効にしましょう。金額など、小数点が必要な場合は小数点を有効にします。
8. 日付
用途: 日付の選択に使用します。カレンダーから日付を選択できます。
主な設定項目:
- フィールド名:内部識別用の名前(通常は
date) - フィールドラベル:ユーザーに表示されるラベル
- 必須項目:必須かどうか
- 日付フォーマット:日付の表示形式(例:YYYY-MM-DD、YYYY/MM/DD)
- 最小日付:選択可能な最小日付
- 最大日付:選択可能な最大日付
- 説明文:フィールドの下に表示される補足説明
バリデーション:
- 日付の形式をチェック
- 最小日付・最大日付の範囲内かチェック
使用例:
- 生年月日:フィールドラベル「生年月日」、必須項目、日付フォーマット「YYYY-MM-DD」、最大日付「今日」
- 希望日:フィールドラベル「希望日」、必須項目、最小日付「今日」、最大日付「1年後」
- イベント日:フィールドラベル「イベント日」、必須項目、最小日付「今日以降」
💡 ヒント: 過去の日付を選択させたくない場合は、最小日付を「今日」に設定しましょう。
選択系フィールド
9. セレクトボックス
用途: プルダウンから1つの選択肢を選ぶ場合に使用します。選択肢が多い場合に適しています。
主な設定項目:
- フィールド名:内部識別用の名前
- フィールドラベル:ユーザーに表示されるラベル
- 必須項目:必須かどうか
- 選択肢:選択可能な項目のリスト(1行に1つずつ入力)
- デフォルト値:初期表示される選択肢
- 説明文:フィールドの下に表示される補足説明
選択肢の設定方法:
- フィールド設定画面の「選択肢」欄を開く
- 1行に1つずつ選択肢を入力
- 「追加」ボタンで選択肢を追加
- 順序はドラッグ&ドロップで変更可能
使用例:
- 都道府県:選択肢「北海道、青森県、岩手県…」(47都道府県)
- お問い合わせ種別:選択肢「商品について、サービスについて、その他」
- 年齢層:選択肢「10代、20代、30代、40代、50代、60代以上」
💡 ヒント: 選択肢が多い場合は、セレクトボックスを使用します。選択肢が少ない場合は、ラジオボタンの方が見やすい場合があります。
10. ラジオボタン
用途: 複数の選択肢から1つを選ぶ場合に使用します。選択肢が少ない場合に適しています。
主な設定項目:
- フィールド名:内部識別用の名前
- フィールドラベル:ユーザーに表示されるラベル
- 必須項目:必須かどうか
- 選択肢:選択可能な項目のリスト
- デフォルト値:初期選択される選択肢
- レイアウト:横並び・縦並びの選択
- 説明文:フィールドの下に表示される補足説明
使用例:
- 性別:選択肢「男性、女性、その他」、レイアウト「横並び」
- ご希望の連絡方法:選択肢「メール、電話、FAX」、レイアウト「縦並び」
- お問い合わせの緊急度:選択肢「緊急、通常、不急」、レイアウト「縦並び」
💡 ヒント: 選択肢が3〜5個程度の場合は、ラジオボタンが適しています。選択肢が多い場合は、セレクトボックスを使用しましょう。
11. チェックボックス
用途: 複数の選択肢から複数を選ぶ場合に使用します。興味のある分野、希望するサービスなど、複数選択が必要な場合に適しています。
主な設定項目:
- フィールド名:内部識別用の名前
- フィールドラベル:ユーザーに表示されるラベル
- 必須項目:必須かどうか(最低1つは選択が必要)
- 選択肢:選択可能な項目のリスト
- デフォルト値:初期選択される選択肢
- レイアウト:横並び・縦並びの選択
- 最小選択数:最低選択が必要な数
- 最大選択数:最大選択可能な数
- 説明文:フィールドの下に表示される補足説明
使用例:
- 興味のある分野:選択肢「Webデザイン、プログラミング、マーケティング、その他」、レイアウト「縦並び」、最小選択数1
- 希望するサービス:選択肢「資料請求、メールマガジン、セミナー参加」、レイアウト「縦並び」
- お知らせの希望:選択肢「新商品情報、セール情報、イベント情報」、レイアウト「横並び」
💡 ヒント: 複数選択が必要な場合は、チェックボックスを使用します。1つだけ選択する場合は、ラジオボタンを使用しましょう。
住所系フィールド
12. 郵便番号
用途: 郵便番号の入力に使用します。入力すると自動的に住所が補完されます。
主な設定項目:
- フィールド名:内部識別用の名前(通常は
postal_code) - フィールドラベル:ユーザーに表示されるラベル
- 必須項目:必須かどうか
- プレースホルダー:入力例を表示(例:123-4567)
- 説明文:フィールドの下に表示される補足説明
バリデーション:
- 郵便番号の形式をチェック(123-4567形式)
- ハイフンあり・なしの両方に対応
自動補完機能:
- 郵便番号を入力すると、都道府県・市区町村が自動的に補完されます
- 都道府県フィールドと市区町村フィールドと連動
使用例:
- 郵便番号:フィールドラベル「郵便番号」、必須項目、プレースホルダー「123-4567」
💡 ヒント: 郵便番号フィールドは、都道府県フィールドと市区町村フィールドと組み合わせて使用すると便利です。
13. 都道府県
用途: 都道府県の選択に使用します。日本の47都道府県から選択できます。
主な設定項目:
- フィールド名:内部識別用の名前(通常は
prefecture) - フィールドラベル:ユーザーに表示されるラベル
- 必須項目:必須かどうか
- デフォルト値:初期選択される都道府県
- 説明文:フィールドの下に表示される補足説明
連動機能:
- 市区町村フィールドと連動し、選択した都道府県に応じて市区町村の選択肢が変わります
- 郵便番号フィールドと連動し、郵便番号入力時に自動選択されます
使用例:
- 都道府県:フィールドラベル「都道府県」、必須項目
14. 市区町村
用途: 市区町村の選択に使用します。都道府県に応じて選択肢が変わります。
主な設定項目:
- フィールド名:内部識別用の名前(通常は
city) - フィールドラベル:ユーザーに表示されるラベル
- 必須項目:必須かどうか
- 連動フィールド:連動する都道府県フィールドを選択
- 説明文:フィールドの下に表示される補足説明
連動機能:
- 都道府県フィールドと連動し、選択した都道府県に応じて選択肢が変わります
- 郵便番号フィールドと連動し、郵便番号入力時に自動選択されます
使用例:
- 市区町村:フィールドラベル「市区町村」、必須項目、連動フィールド「都道府県」
💡 ヒント: 住所入力フォームでは、郵便番号→都道府県→市区町村の順に配置すると、ユーザーが入力しやすくなります。
ファイル・その他フィールド
15. ファイル
用途: ファイルのアップロードに使用します。画像、PDF、Word文書などのファイルをアップロードできます。
主な設定項目:
- フィールド名:内部識別用の名前(通常は
file) - フィールドラベル:ユーザーに表示されるラベル
- 必須項目:必須かどうか
- 許可ファイルタイプ:アップロード可能なファイル形式(例:jpg, png, pdf)
- 最大ファイルサイズ:アップロード可能な最大サイズ(例:5MB)
- 説明文:フィールドの下に表示される補足説明
バリデーション:
- ファイルタイプをチェック
- ファイルサイズをチェック
- MIMEタイプをチェック
使用例:
- 画像アップロード:フィールドラベル「画像をアップロード」、許可ファイルタイプ「jpg, png, gif」、最大ファイルサイズ「5MB」
- 資料添付:フィールドラベル「資料を添付」、許可ファイルタイプ「pdf, doc, docx」、最大ファイルサイズ「10MB」
- 履歴書:フィールドラベル「履歴書をアップロード」、必須項目、許可ファイルタイプ「pdf」、最大ファイルサイズ「5MB」
💡 ヒント: ファイルサイズは、サーバーの設定(upload_max_filesize、post_max_size)も確認してください。大きなファイルをアップロードする場合は、サーバーの設定も調整が必要な場合があります。
16. 同意チェック
用途: 利用規約やプライバシーポリシーへの同意確認に使用します。チェックボックス形式で表示されます。
主な設定項目:
- フィールド名:内部識別用の名前(通常は
agreement) - フィールドラベル:ユーザーに表示されるラベル
- 必須項目:通常は必須(デフォルトで必須)
- 同意文:表示される同意文(例:「利用規約に同意します」)
- リンクURL:利用規約やプライバシーポリシーのページURL
- リンクテキスト:リンクに表示されるテキスト(例:「利用規約」)
- 説明文:フィールドの下に表示される補足説明
バリデーション:
- チェックが入っているか確認
- 必須項目の場合は、チェックが必須
使用例:
- 利用規約への同意:同意文「利用規約に同意します」、リンクURL「/terms」、リンクテキスト「利用規約」
- プライバシーポリシーへの同意:同意文「プライバシーポリシーに同意します」、リンクURL「/privacy」、リンクテキスト「プライバシーポリシー」
💡 ヒント: 個人情報を扱うフォームでは、必ず同意チェックフィールドを追加しましょう。リンクURLを設定することで、ユーザーが規約を確認しやすくなります。
17. 隠しフィールド
用途: ユーザーには見えないが、フォーム送信時に値が含まれるフィールドです。フォームの識別や、システム側で必要な情報を渡すために使用します。
主な設定項目:
- フィールド名:内部識別用の名前
- フィールドラベル:管理画面での識別用(ユーザーには表示されません)
- 値:送信時に含まれる値
- 説明文:管理画面での説明(ユーザーには表示されません)
使用例:
- フォームバージョン:フィールド名「form_version」、値「1.0」
- 参照元URL:フィールド名「referrer」、値「{動的に設定}」
- キャンペーンID:フィールド名「campaign_id」、値「summer2024」
💡 ヒント: 隠しフィールドは、フォームの分析や追跡に使用できます。ただし、ユーザーが開発者ツールで確認できるため、機密情報は含めないでください。
フィールドタイプの選び方
適切なフィールドタイプを選ぶためのガイドです。
| 入力内容 | 推奨フィールドタイプ | 理由 |
|---|---|---|
| 名前、タイトルなど短いテキスト | テキスト | 1行で入力できる |
| お問い合わせ内容など長いテキスト | テキストエリア | 複数行で入力できる |
| メールアドレス | メールアドレス | 形式の自動チェック |
| 電話番号 | 電話番号 | 形式の自動チェック |
| ウェブサイトURL | URL | 形式の自動チェック |
| 年齢、数量など数値 | 数値 | 数値のみの入力、範囲チェック |
| 生年月日、希望日など日付 | 日付 | カレンダーから選択 |
| 都道府県 | 都道府県 | 47都道府県から選択 |
| 住所(郵便番号から) | 郵便番号 + 都道府県 + 市区町村 | 自動補完機能 |
| 選択肢が多く1つ選択 | セレクトボックス | スペースを節約 |
| 選択肢が少なく1つ選択 | ラジオボタン | 見やすく選択しやすい |
| 複数選択 | チェックボックス | 複数選択可能 |
| ファイル添付 | ファイル | ファイルアップロード機能 |
| 利用規約への同意 | 同意チェック | チェックボックス形式 |
よくある質問
Q: フィールドタイプを後から変更できますか?
A: フィールドタイプは変更できません。変更したい場合は、フィールドを削除して新しいフィールドタイプで追加してください。ただし、データが失われる可能性があるため、注意が必要です。
Q: 1つのフォームに同じフィールドタイプを複数追加できますか?
A: はい、可能です。ただし、フィールド名は重複しないように注意してください。例:メールアドレス1、メールアドレス2など。
Q: フィールドの順序を変更できますか?
A: はい、ドラッグ&ドロップまたは上下ボタンで順序を変更できます。
Q: フィールドを必須項目に設定する必要はありますか?
A: フォームの目的によって異なりますが、重要な情報(名前、メールアドレスなど)は必須項目に設定することを推奨します。
Q: プレースホルダーは必須ですか?
A: 必須ではありませんが、入力例を表示することで、ユーザーが入力しやすくなります。特に形式が決まっているフィールド(メールアドレス、電話番号など)には設定することを推奨します。
まとめ
FormNestでは、17種類のフィールドタイプが利用できます。各フィールドタイプには特徴があり、適切に選択することで、ユーザーが入力しやすいフォームを作成できます。
フィールドタイプを選ぶ際のポイント:
- 入力内容に適したフィールドタイプを選択
- バリデーション機能を活用して入力ミスを防ぐ
- 必須項目を適切に設定
- プレースホルダーで入力例を表示
- 説明文で補足情報を提供
詳細な設定方法については、「基本的なフォームの作成方法」の記事を参照してください。問題が解決しない場合は、ヘルプページの「よくある問題と解決方法」セクションを確認するか、サポートにお問い合わせください。

