WordPress コンタクトフォームから条件付きフィールドの作成

どのような条件に応じてフィールドを表示するかどうかを設定したい場合があります。 このような場合に、条件付きフィールドや条件ロジック機能を使用することができます。

WordPress無料で利用できるコンタクトフォームのプラグインである お問い合わせフォーム7では、条件付きフィールドの機能を提供していませんが、別のプラグインをインストールして、この機能を実装することができます。 Quform 同じ有料コンタクトフォームのプラグインでは、自主的に、この機能が提供されます。

Conditional Fields for Contact Form 7 - Contact Form 7 の条件付きフィールドプラグイン

コンタクトフォーム条件フィールド

このプラグインお問い合わせフォーム7追加のロジックを追加します。

CF7フォームを編集すると、 「Conditional fields Group」(条件付きフィールドグループ)という追加のタグを見ることができます。 開始タグと終了タグの間に追加するすべての内容は、基本的に非表示になり(つまり、hidden状態)。

フィールドグループ(複数可)を追加したら、[保存]をクリックする必要があります。

次に "条件付きフィールド"タブに移動して、グループが表示されるよう複数の条件を作成します。

Contact Form 7は無料で提供されているコンタクトフォームのプラグインで、多くのサイトで使用されています。 無料ですので、機能が多くないが、Conditional Fields for Contact Form 7のような付加的なプラグインを使用すると、機能を拡張することができます。 (参考までに、プラグインは、最小限に維持することが良いが、無料でこのような機能を使用する場合は、Contact Form 7と付加的なプラグインをインストールして使用することができます。)

QuformのConditional Logic(条件付きロジック)機能

有料プラグイン Quformに自主的にConditional Logic(条件ロジック、条件付き論理)オプションが提供されます。

 

条件に応じて表示または非表示にするフィールドの設定アイコン(ホイール状のアイコン)をクリックし、[Logic]タブを選択して条件付きロジックを指定できます。

WordPress コンタクトフォームから条件付きフィールドの作成2

Enable conditional logic(条件付きロジックの有効化)をOnに設定すると、 Logic Rules(ロジックルール)を指定できるオプションが表示されます。

2017_1019_更新: Quformはバージョン2で、最近更新されたUIと機能が大幅に改善されました。 特に、複数のページのフォーム入力機能が追加され、ページの読み込み速度を向上させるために、不必要なスクリプトや機能を無効にすることができる機能も追加されました。

最後に、

Contact Form 7とQuformで条件付きフィールドを追加する方法について簡単に説明しました。

このブログには、Quformがインストールされています。 しかし、このブログで使用されている Diviテーマは、基本的に Contact Formモジュールがあります。 最近更新されContact Formモジュールに、より多くのオプションが追加され、Conditional Logic(条件付きロジック)とField Validation(フィールド検証)機能も追加されました。

エレガント ThemesのDiviテーマを使用している場合は、あえてContact FormプラグインをインストールせずにDiviで提供されているContact Formモジュールを使用しても問題ありません。

メモ:

一部の記事にはアフィリエイトリンクが含まれている場合があり、パートナーの活動で一定額の手数料を受け取ることがあります。

2のコメント

コメントを残す

*メールアドレスは公開されません。