### [WPFormsのドロップダウンフィールドで複数選択を許可する方法](https://wpforms.com/docs/how-to-allow-multiple-selections-to-a-dropdown-field-in-wpforms/) **公開日:** 2023年11月26日 **著者:** Umair Majeed **抜粋:** ドロップダウンフィールドでユーザーが複数のオプションを選択できるようにする方法を学びます。 **コンテンツ:** ドロップダウンフィールドでユーザーが複数のオプションを選択できるようにしたいですか？WordPressフォームに複数選択ドロップダウンを追加すると、チェックボックスフィールドを使用せずに、ユーザーが多くのオプションを選択できるようになります。 このチュートリアルでは、WPFormsで複数選択ドロップダウンフィールドを設定する方法を説明します。 このフォームを完了するには、ブラウザでJavaScriptを有効にしてください。 ### このフォームデモをお試しください！ 詳しく知りたいクラブをいくつか選択してください。水泳アーチェリークリケットダンス 送信 --- ### はじめに 開始する前に、[新しいフォームを作成](https://wpforms.com/docs/creating-first-form/)するか、既存のフォームを編集する必要があります。 例として、スポーツクラブの問い合わせフォームを設定します。これを行うには、まずフォームビルダーを開きます。 次に、**標準フィールド**セクションに移動して**ドロップダウン**フィールドを見つけます。フィールドをクリックしてフォームに追加するか、フォームのプレビューエリアにドラッグアンドドロップします。  フィールドが追加されたら、それをクリックしてフィールドオプションパネルを開きます。 次に、このフィールドの**ラベル**を「**詳しく知りたいクラブをいくつか選択してください**」に変更します。また、**選択肢**の下に4つのオプションを追加します：水泳、アーチェリー、クリケット、ダンス。  フィールドオプションの中から、**詳細設定**セクションに移動し、クリックして追加の設定を開きます。 次に、「**複数オプション選択**」というラベルのオプションを選択して有効にします。  ### カスタマイズオプション ドロップダウンフィールドには、クラシックとモダンという2つの異なるスタイル構成が利用可能です。これらはそれぞれドロップダウンのスタイリングをわずかに異なる方法でフォーマットします。ドロップダウンフィールドのスタイルは、**詳細設定 » スタイル**で変更できます。  #### クラシックスタイル クラシックスタイルでは、すべてのオプションがボックス内にリスト表示されます。ドロップダウンに4つ以上のオプションが追加されると、ボックスに縦スクロールバーが表示されます。  **注:** クラシックスタイルでは、データがない行でも、少なくとも4行が表示されます。 複数のオプションを選択するには、**Control**キー（Macの場合は**Command**キー）を押しながらクリックします。これにより、選択した選択肢にハイライト効果が追加されます。  #### モダンなスタイル モダンなスタイルでは、標準的なドロップダウンが表示されます。このドロップダウンでは、オプションリストをスクロールして選択するか、検索語を入力して目的の選択肢を見つけることができます。  複数のオプションが選択されると、各オプションがドロップダウンバーに追加されます。  ### 条件付きロジックの設定 複数選択ドロップダウンで[条件付きロジック](https://wpforms.com/docs/how-to-use-conditional-logic-with-wpforms/)を設定すると、ユーザーが複数のドロップダウン選択肢を選択した場合にフィールドを表示または非表示にすることができます。 たとえば、スポーツクラブの問い合わせフォームでは、ユーザーがドロップダウンから**水泳**と**ダンス**の両方を選択した場合にメッセージを表示します。メッセージでは、これらのクラブの開催時間が重複していることを知らせます。 これを設定するには、まずフォームに**HTML**フィールドを追加します。  次に、**コード**セクションに、「**ご注意！**選択したクラブの開催時間が重複しています。」というメッセージを追加できます。  その後、ユーザーが水泳とダンスを選択した場合にのみフィールドが表示されるように、条件付きロジックを設定する必要があります。これを行うには、**スマートロジック**セクションをクリックして開き、**条件付きロジックを有効にする**オプションを選択します。  次に、ロジックを「**表示**」このフィールドは、「**詳しく知りたいクラブをいくつか選択してください が 水泳 であり、かつ 詳しく知りたいクラブをいくつか選択してください が ダンス である場合**」と設定します。  このフィールドは、ユーザーがドロップダウンフィールドから水泳とダンスの両方を選択しない限り非表示になります。  **注:** AND演算子の使用方法の詳細については、[スマート条件付きロジックに関するガイド](https://wpforms.com/docs/how-to-use-and-or-conditional-logic/ "WPFormsでスマート条件付きロジック（AND – OR）を使用する方法")をご覧ください。 これで、WPFormsで複数選択ドロップダウンフィールドを設定できます。 次に、ドロップダウン、ラジオボタン、またはチェックボックスフィールドの多数の選択肢を簡単に追加したいですか？詳細については、[選択肢を一括追加する方法](https://wpforms.com/docs/how-to-bulk-add-choices-for-multiple-choice-checkbox-and-dropdown-fields/ "複数選択、チェックボックス、ドロップダウンフィールドの選択肢を一括追加する方法")のチュートリアルをご覧ください！ **カテゴリ:** フィールド、フィールドのカスタマイズ ---