--- title: "基本要素" slug: "the-basic-elements" abstract: "フォーム作成によく使われる要素の概要:テキスト、ファイルアップロード、番号、単行テキスト、多行テキスト、メール、電話、チェックボックス、日付。" --- # 基本要素 フォームでよく使われる要素、例えばテキスト、メール、電話はフォーム**要素**ペインの**基本**セクションにまとめられています。これらの要素はフォーム**要素**ペインの**一般**タブからフォームキャンバスにドラッグ&ドロップすると、フォームフィールドとなり、編集できます。 このトピックでは、基本的な形態要素とその設定について説明します。 ## 本文 テキスト要素を使ってフォームにテキストフィールドを追加してください。この要素をフォームのタイトルに使って目的を述べることができます。例えば、キャリア問い合わせフォームやお問い合わせフォームなどです。 セクション アイテム 概要 詳細 本文 例えば、フォームのタイトルにテキスト要素を追加するときに現れるテキストです。 フィールド名 元素の名前。 HTMLタグ テキスト用のHTMLタグを選択します。タグを追加するには、sitecore/System/Settings/Forms/Meta Data/Text Tagsへ行ってください。 スタイリング CSSクラス フィールドのCSSクラスを定義します。 条件 編集条件 ウェブフォームのフィールドに条件付きアクションを適用してください。条件[を追加する](https://doc.sitecore.com/xp/en/developers/101/sitecore-experience-manager/use-conditional-logic-for-your-forms.html)には**「条件を編集」**をクリックします。 ## ファイルアップロード 「ファイルアップロード」要素を使って、ウェブフォームのファイルアップロードの可能性を追加しましょう。訪問者がウェブフォームに1つのファイルまたは複数のファイルを添付できるように許可できます。例えば、履歴書、アバター、プロフィール写真などです。 > !注ファイルのアップロードは [エクスポートフォームのCSVファイル](https://doc.sitecore.com/xp/ja/users/104/sitecore-experience-platform/export-form-results.html "Export form results")に表示されます。 フォームエディターでは、訪問者がアップロードできるファイル数、ファイルのサイズやフォーマットを決定できます。 セクション アイテム 概要 詳細 レーベル 特定のフォーム欄が求めている情報が何を求めているかを連絡先に伝えるキャプション。 フィールド名 元素の名前。 ファイルサイズの制限 訪問者がアップロードできるファイルの最大ファイルサイズを決定します。デフォルトでは、訪問者は最大2GBを超えないファイルだけアップロードできます。 **ファイルサイズバリデーター** のチェックボックスが選択されている場合のみ適用されます。 ファイル数の制限 訪問者がアップロードできるファイル数を決定します。このフィールドは必須です。 **ファイル数検証ツール** のチェックボックスが選択されている場合のみ適用されます。 ファイル形式の制限 許可されるファイル拡張子やMIMEタイプをカンマで区切って決定します。例えば、 *application/PDF* 、 *.pdf* 、 *pdf* このフィールドが空のままの場合、訪問者は任意の形式のファイルをアップロードできます。 **ファイルタイプ検証器**のチェックボックスが選択されている場合のみ適用されます。 検証 ファイルサイズバリデーター ファイル **サイズの制限** 欄で設定した値に従ってファイルサイズを検証するよう選択してください。 ファイルカウント検証器 ファイル数 **の制限** 欄で設定した値に従ってファイル数を検証するオプションを選択してください。 ファイルタイプ検証器 **「制限されたファイルタイプ**」フィールドで設定された値に基づいてファイルタイプを検証するオプションを選択してください。 フィールドの重要性 連絡先が欄を埋める必要があるかどうかを示します。オプションは **任意** または **必須**です。 スタイリング CSSクラス フィールドのCSSクラスを定義します。 ラベル用のCSSクラス ラベルのCSSクラスを定義します。 条件 編集条件 ウェブフォームのフィールドに条件付きアクションを適用してください。条件[を追加する](https://doc.sitecore.com/xp/en/developers/101/sitecore-experience-manager/use-conditional-logic-for-your-forms.html)には**「条件を編集」**をクリックします。 詳細設定 セーブを許可します フォーム提出時に入力済みフィールドデータの保存を有効または無効にします。 パフォーマンストラッキング フィールドのパフォーマンスに関するデータを記録するために選択してください。追跡を行うには、 **設定**タブのフォームの「パフォーマンス追跡」チェックボックスも選択する必要があります。 価値提供者 フィールドをリンクしたいソースを選択してください。フォームのプリフィル値はこのソースから取得されます。 価値提供者パラメータ フィールドに合わせてキーを入力してください。 > !注訪問者に大きなファイルをアップロードさせたい場合は、ウェブサーバーが大きなファイルサイズを許容するように設定されているか確認してください。そうしないと、訪問者に「 *HTTP Error 413 Request Entity Too Large*」というエラーメッセージが表示される可能性があります。ASP.NETのファイルアップロード設定はWeb.configファイルで調整できます: ## 番号 数字の要素を使って数字を入力するフィールドを追加してください。 セクション アイテム 概要 詳細 レーベル 特定のフォーム欄が求めている情報が何を求めているかを連絡先に伝えるキャプション。 フィールド名 要素名。フィールド名には必ず意味のある名前を使わせてください。フィールド名はフォームフィールドのSitecore定義アイテムの実際のアイテム名です。 デフォルト値 初期価値。 プレースホルダーテキスト 期待値を説明するためのヒントとして機能するフォームフィールド内のテキスト。プレースホルダーテキストは、連絡先がフィールドをクリックすると消えます。例えば、ここにファーストネームを入力してください。 最小値 最小値を決定します。入力がこのフィールドで指定された値より低い場合、コンタクトは検証エラーメッセージを表示します。 最大価値 最大値を決定します。入力がこのフィールドで指定された値より大きい場合、交接者は検証エラーメッセージを表示します。 ステップ 例えば、連絡先に偶数だけを埋めたい場合は、数値区間を指定します。デフォルト値は1です。 検証 フィールド検証 フィールド検証が適用されるかどうかを決定します。 フィールドの重要性 訪問者が項目を記入しなければならないかどうかを示します。オプションは **任意** または **必須**です。 スタイリング CSSクラス フィールドのCSSクラスを定義します。 ラベル用のCSSクラス ラベルのCSSクラスを定義します。 条件 編集条件 ウェブフォームのフィールドに条件付きアクションを適用してください。条件[を追加する](https://doc.sitecore.com/xp/en/developers/101/sitecore-experience-manager/use-conditional-logic-for-your-forms.html)には**「条件を編集」**をクリックします。 詳細設定 セーブを許可します フォーム提出時に入力済みフィールドデータの保存を有効または無効にします。 パフォーマンストラッキング フィールドのパフォーマンスに関するデータを記録するために選択してください。追跡を行うには、 **設定**タブのフォームの「パフォーマンス追跡」チェックボックスも選択する必要があります。 価値提供者 フィールドをリンクしたいソースを選択してください。フォームのプリフィル値はこのソースから取得されます。 価値提供者パラメータ フィールドに合わせてキーを入力してください。 ## 単行テキスト 単行テキスト要素を使って、テキストを1行入力するフィールドを追加してください。例えば、名前入力欄の場合などです。 セクション アイテム 概要 詳細 レーベル 特定のフォーム欄が求めている情報が何を求めているかを連絡先に伝えるキャプション。 フィールド名 元素の名前。 デフォルト値 初期価値。 プレースホルダーテキスト 期待値を説明するためのヒントとして機能するフォームフィールド内のテキスト。連絡先がフィールドをクリックすると、プレースホルダーテキストは消えます。例えば、ここにファーストネームを入力してください。 最小テキスト長 単行テキスト要素の入力フィールドの最小テキスト長を決定します。入力がこのフィールドに指定された文字数より短い場合、コンタクトは検証エラーメッセージを表示します。 最大テキスト長 単行テキスト要素の入力フィールドの最大テキスト長さを決定します。入力がこのフィールドに指定された文字数を超える場合、連絡先は検証エラーメッセージを表示します。 検証 フィールド検証 フィールド検証が適用されるかどうかを決定します。 フィールドの重要性 連絡先が欄を埋める必要があるかどうかを示します。オプションは **任意** または **必須**です。 スタイリング CSSクラス フィールドのCSSクラスを定義します。 ラベル用のCSSクラス ラベルのCSSクラスを定義します。 条件 編集条件 ウェブフォームのフィールドに条件付きアクションを適用してください。条件を追加するには **「条件を編集」** をクリックします。 詳細設定 セーブを許可します フォーム提出時に入力済みフィールドデータの保存を有効または無効にします。 パフォーマンストラッキング フィールドのパフォーマンスに関するデータを記録するために選択してください。追跡を行うには、 **設定**タブのフォームの「パフォーマンス追跡」チェックボックスも選択する必要があります。 価値提供者 フィールドをリンクしたいソースを選択してください。フォームのプリフィル値はこのソースから取得されます。 価値提供者パラメータ フィールドに合わせてキーを入力してください。 ## 複数行テキスト 複数行テキスト要素を使って、複数の行を入力できるフィールドを追加してください。この要素は、住所やコメント、説明などの長い回答にも使えます。 セクション アイテム 概要 詳細 レーベル 特定のフォーム欄が求めている情報が何を求めているかを連絡先に伝えるキャプション。 フィールド名 元素の名前。 デフォルト値 初期価値。 プレースホルダーテキスト 期待値を説明するためのヒントとして機能するフォームフィールド内のテキスト。プレースホルダーテキストは、連絡先がフィールドをクリックすると消えます。例えば、ここにファーストネームを入力してください。 行数 利用可能な回数を決定します。 最小テキスト長 複数行テキスト要素の入力フィールドの最小テキスト長を決定します。入力がこのフィールドに指定された文字数より短い場合、連絡先は検証エラーメッセージを表示します。 最大テキスト長 複数行テキスト要素の入力フィールドの最大テキスト長を決定します。入力がこのフィールドに指定された文字数を超えると、連絡先は検証エラーメッセージが表示されます。 検証 フィールド検証 フィールド検証が適用されるかどうかを決定します。 フィールドの重要性 連絡先が欄を埋める必要があるかどうかを示します。オプションは **任意** または **必須**です。 スタイリング CSSクラス フィールドのCSSクラスを定義します。 ラベル用のCSSクラス ラベルのCSSクラスを定義します。 条件 編集条件 ウェブフォームのフィールドに条件付きアクションを適用してください。条件[を追加する](https://doc.sitecore.com/xp/en/developers/101/sitecore-experience-manager/use-conditional-logic-for-your-forms.html)には**「条件を編集」**をクリックします。 詳細設定 セーブを許可します フォーム提出時に入力済みフィールドデータの保存を有効または無効にします。 パフォーマンストラッキング フィールドのパフォーマンスに関するデータを記録するために選択してください。追跡を行うには、 **設定**タブのフォームの「パフォーマンス追跡」チェックボックスも選択する必要があります。 価値提供者 フィールドをリンクしたいソースを選択してください。フォームのプリフィル値はこのソースから取得されます。 価値提供者パラメータ フィールドに合わせてキーを入力してください。 ## メール メール要素を使って、メールアドレスを入力するフィールドを追加してください。 セクション アイテム 概要 詳細 レーベル 特定のフォーム欄が求めている情報が何を求めているかを連絡先に伝えるキャプション。 フィールド名 元素の名前。 デフォルト値 初期価値。 プレースホルダーテキスト 期待値を説明するためのヒントとして機能するフォームフィールド内のテキスト。連絡先がフィールドをクリックすると、プレースホルダーテキストは消えます。例えば、ここにファーストネームを入力してください。 最小テキスト長 メール要素の入力フィールドの最小テキスト長さを決定します。連絡先は入力がこのフィールドに指定された文字数より短い場合、検証エラーメッセージが表示されます。 最大テキスト長 メール要素の入力フィールドの最大テキスト長を決定します。連絡先は、入力がこのフィールドに指定された文字数を超えると検証エラーメッセージが表示されます。 検証 フィールド検証 フィールド検証が適用されるかどうかを決定します。オプションは **Email Validator** または **String Length Validatorです。** フィールドの重要性 連絡先が欄を埋める必要があるかどうかを示します。オプションは **任意** または **必須**です。 スタイリング CSSクラス フィールドのCSSクラスを定義します。 ラベル用のCSSクラス ラベルのCSSクラスを定義します。 条件 編集条件 ウェブフォームのフィールドに条件付きアクションを適用してください。条件[を追加する](https://doc.sitecore.com/xp/en/developers/101/sitecore-experience-manager/use-conditional-logic-for-your-forms.html)には**「条件を編集」**をクリックします。 詳細設定 セーブを許可します フォーム提出時に入力済みフィールドデータの保存を有効または無効にします。 パフォーマンストラッキング フィールドのパフォーマンスに関するデータを記録するために選択してください。追跡を行うには、 **設定**タブのフォームの「パフォーマンス追跡」チェックボックスも選択する必要があります。 価値提供者 フィールドをリンクしたいソースを選択してください。フォームのプリフィル値はこのソースから取得されます。 価値提供者パラメータ フィールドに合わせてキーを入力してください。 ## メール確認 メールアドレスの誤送信を防ぐために、メール確認欄の使用を検討してください。 セクション アイテム 概要 詳細 メールラベル 特定のフォーム欄が求めている情報が何を求めているかを連絡先に伝えるキャプション。 メールラベルの確認 特定のフォーム欄が求めている情報が何を求めているかを連絡先に伝えるキャプション。 フィールド名 元素の名前。 デフォルト値 初期価値。 メールのプレースホルダーテキスト 期待値を説明するヒントとして機能するフォーム欄のテキスト。連絡先がフィールドをクリックすると、プレースホルダーテキストは消えます。例えば、ここにメールアドレスを入力してください。 メールの仮文を確認してください 期待値を説明するヒントとして機能するフォームフィールド内のテキスト。プレースホルダーテキストは、連絡先がフィールドをクリックすると消えます。例えば、ここにメールアドレスを再入力してください。 この設定を適用するには、**フィールド検証**フィールドの「**文字列長バリデーター**」チェックボックスを選択する必要があります。 最小テキスト長 メール要素の入力フィールドの最小テキスト長さを決定します。連絡先は入力がこのフィールドに指定された文字数より短い場合、検証エラーメッセージが表示されます。 この設定を適用するには、**フィールド検証**フィールドの「**文字列長バリデーター**」チェックボックスを選択する必要があります。 最大テキスト長 メール要素の入力フィールドの最大テキスト長を決定します。連絡先は、入力がこのフィールドに指定された文字数を超えると検証エラーメッセージが表示されます。 検証 フィールド検証 フィールド検証が適用されるかどうかを決定します。オプションは **Email Validator** または **String Length Validator**です。 フィールドの重要性 連絡先が欄を埋める必要があるかどうかを示します。オプションは **任意** または **必須**です。 スタイリング CSSクラス フィールドのCSSクラスを定義します。 ラベル用のCSSクラス ラベルのCSSクラスを定義します。 条件 編集条件 ウェブフォームのフィールドに条件付きアクションを適用してください。条件[を追加する](https://doc.sitecore.com/xp/en/developers/101/sitecore-experience-manager/use-conditional-logic-for-your-forms.html)には**「条件を編集」**をクリックします。 詳細設定 セーブを許可します フォーム提出時に入力済みフィールドデータの保存を有効または無効にします。 パフォーマンストラッキング フィールドのパフォーマンスに関するデータを記録するために選択してください。追跡を行うには、 **設定**タブのフォームの「パフォーマンス追跡」チェックボックスも選択する必要があります。 価値提供者 フィールドをリンクしたいソースを選択してください。フォームのプリフィル値はこのソースから取得されます。 価値提供者パラメータ フィールドに合わせてキーを入力してください。 ## 電話 電話要素を使って、電話番号を入力するフィールドを追加します。 セクション アイテム 概要 詳細 レーベル 特定のフォーム欄が求めている情報が何を求めているかを連絡先に伝えるキャプション。 フィールド名 元素の名前。 デフォルト値 初期価値。 プレースホルダーテキスト 期待値を説明するためのヒントとして機能するフォームフィールド内のテキスト。連絡先がフィールドをクリックすると、プレースホルダーテキストは消えます。例えば、ここにファーストネームを入力してください。 最小テキスト長 最小テキスト長を決定します。入力がこのフィールドで指定された文字数より短い場合、連絡先は検証エラーメッセージを表示します。 最大テキスト長 最大テキスト長を決定します。入力がこのフィールドで指定された文字数を超えると、連絡先は検証エラーメッセージを表示します。 検証 フィールド検証 フィールド検証が適用されるかどうかを決定します。オプションは **電話番号検証器** または **文字列長検証器です。** フィールドの重要性 連絡先が欄を埋める必要があるかどうかを示します。オプションは **任意** または **必須**です。 スタイリング CSSクラス フィールドのCSSクラスを定義します。 ラベル用のCSSクラス ラベルのCSSクラスを定義します。 条件 編集条件 ウェブフォームのフィールドに条件付きアクションを適用してください。条件[を追加する](https://doc.sitecore.com/xp/en/developers/101/sitecore-experience-manager/use-conditional-logic-for-your-forms.html)には**「条件を編集」**をクリックします。 詳細設定 セーブを許可します フォーム提出時に入力済みフィールドデータの保存を有効または無効にします。 パフォーマンストラッキング フィールドのパフォーマンスに関するデータを記録するために選択してください。追跡を行うには、 **設定**タブのフォームの「パフォーマンス追跡」チェックボックスも選択する必要があります。 価値提供者 フィールドをリンクしたいソースを選択してください。フォームのプリフィル値はこのソースから取得されます。 価値提供者パラメータ フィールドに合わせてキーを入力してください。 ## チェックボックス チェックボックス要素を使って、ユーザーがオプションを切り替えたり選択したりできるチェックボックスを表示してください。 セクション アイテム 概要 詳細 レーベル 特定のフォーム欄が求めている情報が何を求めているかを連絡先に伝えるキャプション。 フィールド名 元素の名前。 確認済み デフォルトで事前選択されているチェックボックスの値を決定します。 検証 フィールドの重要性 連絡先が欄を埋める必要があるかどうかを示します。オプションは **任意** または **必須**です。 スタイリング CSSクラス フィールドのCSSクラスを定義します。 ラベル用のCSSクラス ラベルのCSSクラスを定義します。 条件 編集条件 ウェブフォームのフィールドに条件付きアクションを適用してください。条件[を追加する](https://doc.sitecore.com/xp/en/developers/101/sitecore-experience-manager/use-conditional-logic-for-your-forms.html)には**「条件を編集」**をクリックします。 詳細設定 セーブを許可します フォーム提出時に入力済みフィールドデータの保存を有効または無効にします。 パフォーマンストラッキング フィールドのパフォーマンスに関するデータを記録するために選択してください。追跡を行うには、 **設定**タブのフォームの「パフォーマンス追跡」チェックボックスも選択する必要があります。 価値提供者 フィールドをリンクしたいソースを選択してください。フォームのプリフィル値はこのソースから取得されます。 価値提供者パラメータ フィールドに合わせてキーを入力してください。 ## 日付 Date要素を使って日付を入力するフィールドを追加してください。 セクション アイテム 概要 詳細 レーベル 特定のフォーム欄が求めている情報が何を求めているかを連絡先に伝えるキャプション。 フィールド名 元素の名前。 選択日 デフォルトで選ばれた日付を指定します。 開始日 開始日を指定します。 終了日 日付範囲の終了日を指定します。 検証 フィールドの重要性 連絡先が欄を埋める必要があるかどうかを示します。オプションは **任意** または **必須**です。 スタイリング CSSクラス フィールドのCSSクラスを定義します。 ラベル用のCSSクラス ラベルのCSSクラスを定義します。 条件 編集条件 ウェブフォームのフィールドに条件付きアクションを適用してください。条件[を追加する](https://doc.sitecore.com/xp/en/developers/101/sitecore-experience-manager/use-conditional-logic-for-your-forms.html)には**「条件を編集」**をクリックします。 詳細設定 セーブを許可します フォーム提出時に入力済みフィールドデータの保存を有効または無効にします。 パフォーマンストラッキング フィールドのパフォーマンスに関するデータを記録するために選択してください。追跡を行うには、 **設定**タブのフォームの「パフォーマンス追跡」チェックボックスも選択する必要があります。 価値提供者 フィールドをリンクしたいソースを選択してください。フォームのプリフィル値はこのソースから取得されます。 価値提供者パラメータ フィールドに合わせてキーを入力してください。 > !注Sitecoreフォームは日付フィールドを HTML5要素。この要素はIE11およびMac OSのSafariブラウザではサポートされていません。これらのブラウザで日付フィールドとdatetime picker要素を取得するには、[カスタム要素の実装](https://doc.sitecore.com/xp/en/developers/101/sitecore-experience-manager/walkthrough--creating-a-custom-form-element.html)を検討してください。