<html lang="ja-jp" dir="ltr"><head></head><body>### [条件ロジック使用時のページ区切りをスキップする方法](https://wpforms.com/developers/how-to-skip-page-breaks-when-using-conditional-logic/)

**公開日:** 2022年3月31日
**著者:** David Ozokoye

**抜粋:** このチュートリアルでは、条件ロジックによって通常は空白になるページ区切りをスキップするために、簡単なJavaScriptスニペットを使用する方法を説明します。

**コンテンツ:**

条件が満たされない場合に、フォームのページ区切りをスキップしたいですか？ページ区切りで条件ロジックを使用すると、条件が満たされない場合でも次のページが表示され、ユーザーは空白のページに直面することになります。簡単なJavaScriptスニペットを使用すれば、これらの不要なページを簡単にスキップできます。

このチュートリアルでは、簡単なJavaScriptスニペットを使用して空白のページをスキップする方法を説明します。

---

## フォームの作成

まず、[新しいフォームを作成](https://wpforms.com/docs/creating-first-form/)するか、既存のフォームを編集してフォームビルダーにアクセスする必要があります。ここでは、複数のページ区切りを持つ見積もりフォームを作成しました。

最初のページでは、ユーザーに関する基本的な情報を収集しています。また、その場で無料の対面見積もりをスケジュールしたいかどうかを尋ねるために、**複数選択**フィールドを追加しました。

**はい**を選択した場合、2ページ目を表示して個人情報を尋ねます。しかし、**いいえ**を選択した場合は、2ページ目を完全にスキップして、フォームの最後のページに直接ジャンプさせたいと考えています。

WPFormsでの[マルチページフォームの作成方法](https://wpforms.com/docs/how-to-create-multi-page-forms-in-wpforms/)については、チュートリアルをご確認ください。

![フォームの作成](https://wpforms.com/wp-content/uploads/2024/11/multiple-choice-field.png)## 条件ロジックの設定

この例では、最初のページで無料の対面見積もりを希望するかどうかを選択した場合にのみ、2ページ目に日付/時刻フィールドと住所フィールドを表示したいと思います。これにより、興味のない訪問者の時間を節約できるため、希望しない場合はこのページを完全にスキップできます。

2ページ目の2つのフィールドには、すべて同じロジックが設定されます。ロジックを設定するには、各フィールドを選択し、**スマートロジック**をクリックします。次に、スイッチを切り替えて**条件ロジックを有効にする**にします。

![スマートロジックタブをクリック](https://wpforms.com/wp-content/uploads/2024/11/enable-smart-logic.png)ドロップダウンから、フィールドの基準となった質問を選択します。このチュートリアルでは、質問は「**無料の対面見積もりをスケジュールしますか？**」という**複数選択**フィールドでした。

![条件ロジックルールの設定](https://wpforms.com/wp-content/uploads/2024/11/configure-conditional-logic.png)条件は、複数選択フィールドへの回答が「はい」の場合はフィールドを表示し、「**いいえ**」の場合はフィールドを非表示にする、というものです。

WPFormsの条件ロジックの詳細については、[こちらのドキュメント](https://wpforms.com/docs/how-to-use-conditional-logic-with-wpforms/ "WPFormsでの条件ロジックの使用方法")をご覧ください。

2ページ目の各フィールドには同じロジックが適用されるため、各フィールドでこの手順を繰り返します。または、レイアウトフィールドを使用して類似のフィールドをグループ化し、[レイアウトフィールドで条件ロジックを有効にする](https://wpforms.com/docs/how-to-use-the-layout-field-in-wpforms/#conditional-logic)こともできます。

## スニペットの追加

次に、以下のスニペットをサイトに追加する必要があります。スニペットをサイトに追加する方法や場所についてサポートが必要な場合は、[こちらのチュートリアル](https://wpforms.com/developers/how-to-add-custom-php-or-javascript-for-wpforms/ "WPForms用のカスタムPHPまたはJavaScriptの追加方法")をご確認ください。

このスニペットは、フォームの各ページをループして、空のページがないかを確認します。空のページがある場合、スクリプトはそのページを完全にスキップして次に進みます。これにより、フォーム全体のユーザーエクスペリエンスが向上します。

## よくある質問

以下に、マルチページフォームでの条件ロジックの使用に関するよくある質問にお答えします。

#### Q: このスニペットは、Elementorポップアップのようなモーダルウィンドウでも機能しますか？

**A:** 現時点では機能しません。

これで、条件ロジックによってフォームで非表示になったページをスキップする方法を学びました。

フォームフィールドに基づいて、**送信**ボタンを条件付きで表示または非表示にしたいですか？[送信ボタンの条件付き表示方法](https://wpforms.com/developers/how-to-conditionally-show-the-submit-button/ "送信ボタンの条件付き表示方法")に関するチュートリアルをご覧ください。

## 参照アクション

[wpforms\_wp\_footer\_end](https://wpforms.com/developers/wpforms_wp_footer/ "wpforms_wp_footer_endアクションの使用")

**カテゴリ:** 拡張

**タグ:** Javascript, JS

---</body></html>