, , ,

Copy of – 条件分岐 のコピー

¥4,900.00

フォーム作成に条件分岐でフォームを編集する機能を追加するアドオン

商品コード: ninja-forms-conditionals カテゴリー: , , , タグ:

条件分岐を使用することで、ユーザーの好みやニーズに合わせて、フォームコンテンツを作成、編集し表示することができます。

条件分岐とは、A を選択したら、A に関する質問だけを答えます。

B を選択したら、B に関する質問だけを答えます。

ユーザーに合わせて最適化することで、フォーム離脱率の改善につながります。

フィールドの表示と非表示 (チェックボックスで選択)

フォーム内容が長く多くなっている場合、ユーザーにとって必要な項目だけを選択し入力できるようにします。

フィールドの値を変更

ユーザーが入力した内容に合わせて、自動で数値の値を変更できます。

リストのアイテム追加と削除

ユーザーがチェックボックスにチェックすることで、フォームでの入力を選択できるようになります。

 

条件分岐の使い方

 

初期設定

フォームに条件分岐を追加するためには、開発モードにする必要があります。

  1. サイドメニュー >  [Ninja Forms] > [設定] をクリックします。
    Ninja-Forms-Conditional-Logics_1サイドメニュー>Ninja-Forms
  2. 表示された画面の [高度な設定] 項目の [フォーム作成画面をか初者モードにする] にチェックを入れます。
  3. [設定を保存] をクリックします。
    Ninja-Forms-Conditional-Logics_Ninja-Forms>開発者モード>設定を保存

フォームに条件分岐を設定することが可能になりました

 

条件分岐の設定画面

このプラグインをインストールすると、フォームの編集画面の [高度な設定] タブに [条件ロジック]という設定項目が追加されます。以下は、既存の「◇お問い合わせフォーム(サンプル)」を例に、条件設定画面へ進みます。

  1. 条件分岐を追加したいフォームの選択
    サイドメニュー >   [Ninja Forms]  >  [ダッシュボード]   >  [お問い合わせフォーム] *を選択します。
    Ninja-Forms-Conditional-Logics_Ninja-Forms_2お問い合わせフォーム選択
    フォームが表示されます。
    Ninja-Forms-Conditional-Logics_Ninja-Forms_2-1お問い合わせフォーム項目表示
  2. 画面上部の [高度な設定] をクリックします。
    Ninja-Forms-Conditional-Logics_Ninja-Forms_2-2高度な設定
    [高度な設定] の設定項目の画面が表示されます。
  3. [条件] をクリックします。

    条件を設定する画面が表示されます。

 

この画面で、選択したフォームの項目ごとに追加したい条件を設定します。
条件の設定の手順は次項「条件分岐の設定」へお進みください。

 

条件分岐の設定

ユーザーが選択した項目によって、表示するフォームの項目が変わるように設定します。
ここでは、「◇お問い合わせフォーム(サンプル)」(下図)*を例に以下の手順で条件を設定します。
①トリガー条件の設定 :ユーザーが「どの項目」で「何を」「どうした」場合に
②アクションの設定  :どの項目(フィールド)を表示するか
③条件が満たされない場合の設定:
ユーザーが [法人] を選択しなかった場合どの項目を表示するか

 

  1.  [条件ロジック] をクリックして、条件分岐の設定画面を表示します。まず [いつ] を設定します。
  2. <いつ>
    ① 左のプルダウン   [法人/個人]:で
    ② 右のプルダウン   [個人]:を
    ③ 真ん中のプルダウン [選択しました]:の場合、

    <アクション>
    ①1番目の項目    [屋号]: 項目をフィールドを表示します。
    ②2番目の項目    [お名前]:項目をフィールドを表示します。
    <条件が満たされない場合>
    ①1番目の項目    [屋号]: フィールドを非表示にします。
    ②2番目の項目    [お名前]:フィールドを非表示にします。

  3. 画面上部の [新しい条件を追加] をクリックして新しい条件を追加設定します。
  4. ユーザーが [個人] を選択した場合(いつ)、以下の条件(アクション)を設定します。
    また、 [個人] を選択しなかった場合(条件が満たされない場合)を設定します。

    <いつ>
    ① 左のプルダウン   [法人/個人] :で
    ② 右のプルダウン   [法人]    :を
    ③ 真ん中のプルダウン [選択しました]:の場合、

    <アクション>
    ①1番目の項目    [会社名]  :項目をフィールドを表示します。
    ②2番目の項目    [ご担当社名]:項目をフィールドを表示します。

    <条件が満たされない場合>
    ①1番目の項目    [会社名]  :項目をフィールドを非表示にします。
    ②2番目の項目    [ご担当者名]:項目をフィールドを非表示にします。
  5. 画面右上の [完了] をクリックします。

 

以上のように、条件を設定します。

 

項目に値を設定

フォームでラジオボタンを項目に追加している場合、選択肢に値を入力する必要があります。
※ここでは引き続き、前述の「お問い合わせフォーム」を例に設定しますします。

  1. サイドメニュー > [Ninja Forms] をクリックします。
    Ninja-Forms-Conditional-Logics_サイド>Ninja-Forms>ダッシュボード
  2. 一覧 からフォームを選択します。
    ここでは「◇お問い合わせフォーム(サンプル)」を選択します。
    Ninja-Forms-Conditional-Logics_サイド>Ninja-Forms>ダッシュボード>フォームを選択
  3. [フォーム項目] 編集画面の右下のNinja-Forms_プラスボタンプラスボタンをクリックします。
    Ninja-Forms-Conditional-Logics_サイド>Ninja-Forms>ダッシュボード>フォームを選択>フォーム+プラスボタンpng
  4. [法人/個人] 項目の 右側の歯車アイコンをクリックします。
    Ninja-Forms-Conditional-Logics_サイド>Ninja-Forms>ダッシュボード>フォームを選択>フォーム項目編集画面png
    ラジオボタンのリストの編集画面が右側に表示されます。
    Ninja-Forms-Conditional-Logics_サイド>Ninja-Forms>ダッシュボード>フォームを選択>法人/個人項目値設定png
  5. [オプション] の [] 列に、各値を入力します。
    ここでは、選択肢の法人に [Company] 、個人「Private] を入力します。
    注)エラーを防ぐために値には英数字及び特定の文字(a-z、0-9、-、_、@、スペース)のみを含めることができます。日本語の文字等は入力できません。
    Ninja-Forms-Conditional-Logics_サイド>Ninja-Forms>ダッシュボード>フォームを選択>法人/個人項目値入力png
  6. [法人] 行の一番右の欄にチェックを入力します。(上図②)
    ※デフォルトで法人が選択されている状態になります。
  7. 編集画面右上の [完了] ボタンをクリックします。
  8. 画面上部の [Preview] をクリックして、フォームを確認します。
    Ninja-Forms-Conditional-Logics_サイド>Ninja-Forms>ダッシュボード>フォームを選択>プレビュー
    <法人の場合>
    Ninja-Forms-Conditional-Logics_サイド>Ninja-Forms>ダッシュボード>フォームを選択>プレビュー>法人
    <個人の場合>
    Ninja-Forms-Conditional-Logics_サイド>Ninja-Forms>ダッシュボード>フォームを選択>プレビュー>個人
  9. 表示に問題がなければ画面右上の [公開] ボタンをクリックします。
    Ninja-Forms-Conditional-Logics_サイド>Ninja-Forms>ダッシュボード>フォームを公開

これで、値が設定されました。

 

ショートコード

Ninja Formsでフォームを作成すると、フォームごとにショートコードが自動的に生成されます。
サイドメニュー > [Ninja Forms] >  [ダッシュボード] からショートコードを確認することができます。
Ninja-Forms-Conditional-Logics_サイド>Ninja-Forms>ダッシュボード>ショートコード

このフォームを任意のページに埋め込むと、サイトでそのフォームが表示されます。

フォーム内容が長く多くなっている場合、訪問者が全ての質問を答える前にサイトを去ってしまうことが多くなります。ユーザーにとって必要な項目だけを選択し入力できるようにカスタマイズしましょう。

 

 

レビュー

レビューはまだありません。

“Copy of – 条件分岐 のコピー” の口コミを投稿します

メールアドレスが公開されることはありません。 が付いている欄は必須項目です