.png)
Wixフォームでドロップダウンの選択肢ごとに質問項目を表示・非表示する方法
- 7 分前
- 読了時間: 9分
「お問い合わせフォームで、選んだ内容によって聞く質問を変えたい」。
そんなご相談をよくいただきます。
たとえば「サービスについて」を選んだ人には予算や希望時期を聞きたいけれど、「採用について」を選んだ人にそれを見せても意味がない、というケースです。
全員に同じ質問を並べると入力の負担が増え、途中で離脱されてしまうことも少なくありません。
Wix Studioには、ドロップダウンの選択肢に応じて質問項目を出し分ける「ルール（条件分岐）」という機能が用意されています。
この記事では、ドロップダウンの値を条件にして、選んだ内容ごとに質問項目を表示・非表示に切り替える方法を、つまずきやすいポイントも含めてお客様の視点で解説します。
選んだ内容で質問を出し分けたい、というフォームの困りごと
1つのお問い合わせフォームで複数の問い合わせ内容に対応しようとすると、どうしても質問項目が増えてしまいます。
サービスの相談、採用の応募、取材の依頼など、目的によって聞きたいことが違うのに、全部の項目を1画面に並べてしまうと、入力する側にとっては「自分に関係ない質問」ばかりが並ぶことになります。
こうしたフォームは入力の負担が大きく、途中離脱の原因になります。
かといって目的別にフォームを何枚も作ると、管理も告知も煩雑になります。
理想は「1つのフォームでありながら、選んだ内容に応じて必要な質問だけを見せる」状態です。
Wix Studioでは、ドロップダウンで選ばれた値を条件にして、選択肢ごとに質問項目を表示・非表示に切り替えられます。
たとえば冒頭でドロップダウンを「サービスについて／採用について」と用意しておき、選ばれた内容に応じて後続の質問を出し分ける、という作り方です。
1つのフォームで複数のニーズに対応できるため、コンバージョン改善や集めるデータの精度向上にも役立ちます。
ドロップダウンの値を条件にする「ルール」の作り方
質問項目の出し分けは、フォームの「ルール」という機能で設定します。
この機能は知っていないとたどり着きにくく、フォームを選択したときに現れる左側のメニューから入る必要があります。
まずは場所を覚えておくのがポイントです。
基本の流れは次のとおりです。
Wix Studioでお問い合わせフォームを用意する（例では質問項目が3つ入った状態）
フォームを選択し、画面左にある「ルール」をクリックする
「追加」をクリックして新しいルールを作成する
条件として、ドロップダウンの値が「オプション1と同じ（以下と同じ／次と同じ）」場合を選ぶ
条件が成立したときのアクションを指定する
設定できたら「保存して閉じる」を押す
条件の部分では「ドロップダウンが◯◯と同じ」だけでなく、「項目が空入力されている」「入力されている」といった指定も選べます。
ここでは「特定の選択肢が選ばれたとき」を条件にしたいので、ドロップダウンの値を基準にします。
この「ドロップダウンの値を条件にする」という発想が、選択肢ごとの出し分けの土台になります。
「項目を非表示にする」アクションの指定を忘れると効かない
ルールを作るうえで、最もつまずきやすいのがアクションの指定です。
条件（どの選択肢が選ばれたとき）を設定しただけでは、フォームは何も変わりません。
条件が成立したときに「何をするか」というアクションを、はっきり指定して初めて分岐が動きます。
不要な質問を隠したいときは、アクションの中から「項目を非表示にする」を選びます。
この指定は黄色いボックスの中にあり、ここで対象の項目を選んで「非表示にする」をチェックするのが肝心です。
ここを設定し忘れると、条件は作ったのに表示が切り替わらない、という状態になります。
「ルールを作ったのに効かない」というつまずきの多くは、このアクションの指定漏れが原因です。
手順としては次のようになります。
ルールの条件（ドロップダウンが特定の値のとき）を設定する
アクションの黄色いボックスから「項目を非表示にする」を選ぶ
非表示にしたい質問項目を指定する
「保存して閉じる」で保存する
条件とアクションは必ずセットで考える、と覚えておくと、設定漏れを防げます。
「表示する」アクションで別の質問項目を出す手順
隠すだけでなく、選択肢に応じて「別の質問を出す」こともできます。
使うのは、非表示と対になる「表示する」アクションです。
ドロップダウンで別のオプションが選ばれたときに、そのときだけ見せたい質問項目を表示する、という設定です。
たとえば、あるオプションが選ばれたときに氏名・メールアドレス・電話番号を出したい場合は、次のように設定します。
再度「ルール」から「追加」をクリックして新しいルールを作る
条件を「ドロップダウンがオプション2と同じ」に設定する
アクションで「表示する」を選ぶ
表示したい項目（例：氏名・メールアドレス・電話番号）を指定する
「ルールを保存する」を押して保存する
このように、選択肢ごとにルールを分けて作ることで、「オプション1のときはこの3項目」「オプション2のときは別の3項目」という出し分けが実現します。
条件は組み合わせて使えるため、2通り×2通りで合計4通りといった多段の分岐も作れます。
ルールの追加に実質的な上限はなく、必要に応じて深く分岐させられるので、複雑な問い合わせ内容にも対応できます。
選択肢ごとの出し分けをどこまで作り込むべきか迷う場合は、一度ご相談ください。
結論：ドロップダウンの値を条件にしたルールで質問項目を切り替えられる
結論：Wix Studioでは、ドロップダウンの値を条件にしたルールを作ることで、選択肢ごとに質問項目を表示・非表示に切り替えられます。
「この選択肢が選ばれたら、この項目を隠す／出す」という条件とアクションの組み合わせが、出し分けの基本です。
実例として、1つのドロップダウンに対してオプションごとに3項目ずつを出し分ける形を見てみます。
オプション1では短い回答・長い回答・数値の3項目を表示し、オプション2では氏名・メールアドレス・電話番号の3項目を表示する、という切り替えです。
選ばれた選択肢 | 表示する質問項目 | 使うアクション |
オプション1 | 短い回答・長い回答・数値 | 表示する／不要項目は非表示にする |
オプション2 | 氏名・メールアドレス・電話番号 | 表示する／不要項目は非表示にする |
このように選択肢ごとにルールを分けておけば、1つのフォームで複数の目的に対応できます。
全員に同じ質問を並べるのではなく、選んだ内容に合わせて必要な質問だけを見せられるため、入力の負担を減らし、集めたいデータを的確に集められます。
編集画面では分かりにくい、プレビューで表示・非表示の挙動を確認する
ルールを設定したら、必ずプレビューで挙動を確認します。
編集画面ではすべての項目が並んで見えているため、切り替わりが分かりにくく、正しく設定できたかどうかを判断しづらいからです。
プレビューでドロップダウンからオプション1を選ぶと、設定した3項目（短い回答・長い回答・数値）が表示されます。
オプション2に切り替えると、今度は別の3項目（氏名・メールアドレス・電話番号）に表示が入れ替わります。
この切り替わりが意図どおりになっているかを、選択肢ごとに実際に選んで確かめます。
確認の流れは次のとおりです。
ルールを保存したらプレビューを開く
ドロップダウンで各選択肢を実際に選んでみる
選択肢ごとに、表示・非表示が意図どおりに切り替わるか確認する
想定と違う場合は、ルールの条件とアクション（特に非表示の指定漏れ）を見直す
もし切り替わらない場合は、前述のとおりアクションの指定が抜けていないかを最初に疑うと、原因を早く特定できます。
ここまで設定できれば、ドロップダウンの選択肢ごとに質問項目を表示・非表示に切り替えるフォームが完成します。
自社のフォームで実際に組んでみて難しいと感じた場合や、問い合わせ全体の設計から相談したい場合は、お気軽にお問い合わせください。
よくある質問（FAQ）
Q. Wixフォームで選択肢によって質問項目を変えることはできますか？
A. できます。
Wix Studioの「ルール」機能を使い、ドロップダウンの値を条件にすると、選択肢ごとに質問項目を表示・非表示に切り替えられます。
1つのフォームで複数の問い合わせ内容に対応できます。
Q. ルール機能はどこにありますか？
A. フォームを選択したときに現れる画面左側のメニューにある「ルール」から入ります。
ふだんは目に入りにくい場所なので、フォームを選択してから左メニューを確認する、と覚えておくとスムーズです。
Q. ルールを作ったのに表示が切り替わりません。
なぜですか？
A. 多くの場合、アクションの指定漏れが原因です。
条件を設定しただけでは動かず、「項目を非表示にする」または「表示する」というアクションを黄色いボックスの中で指定して初めて分岐が動きます。
特に非表示の指定忘れが多いので、最初に確認してください。
Q. 選択肢ごとに違う質問を出すには、ルールをいくつ作りますか？
A. 出し分けたい選択肢ごとにルールを分けて作ります。
例では、オプション1で3項目、オプション2で別の3項目を出すために、それぞれにルールを設定しています。
Q. 条件分岐はいくつまで作れますか？
A. ルールの追加に実質的な上限はありません。
2通り×2通りで合計4通りといった多段の分岐も作れ、必要に応じて深く分岐させられます。
Q. 設定した表示・非表示はどこで確認すればよいですか？
A. プレビューで確認します。
編集画面ではすべての項目が並んで見えるため切り替わりが分かりにくく、プレビューで各選択肢を実際に選んで挙動を確かめるのが確実です。
Q. ドロップダウン以外の条件も設定できますか？
A. できます。
「ドロップダウンが特定の値と同じ」のほかに、「項目が空入力されている」「入力されている」などを条件に指定できます。
目的に合わせて条件を選べます。
【この記事の監修者】
中田ディレクター（株式会社ラジャ｜SEO担当監修）
保有資格・実績：Wixレジェンドレベルパートナー／サイト制作400サイト以上／Wix Studio制作100サイト以上（日本トップクラス）／Wix Studio専門スクール「ノコド道場」運営
