How to setup OTP Verification for WS Form - Contact Form?

Overview

WS Form is a versatile and user-friendly tool that makes creating contact forms for your website effortless. With its intuitive drag-and-drop builder and pre-designed templates, you can quickly design forms tailored to your needs. By integrating the OTP Verification plugin , you can add an extra layer of security to your WS Form by verifying user phone numbers or email addresses through an OTP code before the form is submitted.

This guide will walk you through the steps to set up OTP Verification for your WS Contact Form seamlessly.

Download Plugin

Pricing Plans

Pre-requisites : Download And Installation

To configure OTP Verification on WS Form, you will need to install the miniOrange WordPress OTP Verification plugin and WS Form.

Note: If you have any additional questions or further concerns, please don't hesitate to reach out. You can always drop an email to our support team at mfasupport@xecurify.com and we'll be happy to assist you.

Configuration Steps

Follow these steps to setup OTP Verification on the WS Form:

Step 1: Setup Phone Verification for WS Form - Contact forms

Go to the Forms tab in the OTP Verification plugin then search and select WS Form - Contact Forms from the list.

Select this checkbox to WS Form - Contact Forms.

Enable Phone Verification and click on Click Here to see your list of WS forms.

Select your WS Contact Form from the list and note the Form ID.
Next, click the Edit option.

If the Phone field isn’t already present, add it.
Go to the Basic field on the right and drag and drop the Phone element onto the page from the available options.
Note the Phone Field ID and click the Field Settings icon on the right of the Phone field.
Ensure the phone field is marked as required, then click the Save & Close button.

Go to the Basic field on the right and drag and drop the Text element onto the page from the available options.
Note the Verification field ID and click the Field Settings icon to the right of the verification field.
Update the text field label to "Enter OTP Here".
Ensure the Verification field is marked as required, then click the Save & Close button.

WS Form - Phone Verification Add Verification code field

After adding all the fields, click the Publish button.

WS Form - Phone Verification Setting publish

Navigate to the Form Settings page and add the Form ID, Phone Field ID, and Verification Field ID.
After that click on the Save Settings button.

WS Form - Phone Verification click Save settings

Navigate to your WS Form page and complete all the fields with the required details.
Next, click the Send OTP button.
Enter the OTP received on your phone and click on the Submit button.

WS Form - Phone Verification Submit form

The WS form will be submitted after successful OTP verification.

Step 2: Setup Email Verification for WS Form - Contact forms

Go to the Forms tab in the OTP Verification plugin then search and select WS Form - Contact Forms from the list.

Select this checkbox to WS Form - Contact Forms.

Enable Email Verification and click on Click Here to see your list of WS forms.

Select your WS Contact Form from the list and note the Form ID.
Next, click the Edit option.

If the Email field isn’t already present, add it.
Go to the Basic field on the right and drag and drop the Email element onto the page from the available options.
Note the Email Field ID and click the Field Settings icon on the right of the email field.
Ensure the email field is marked as required, then click the Save & Close button.

Go to the Basic field on the right and drag and drop the Text element onto the page from the available options.
Note the Verification field ID and click the Field Settings icon to the right of the verification field.
Update the text field label to "Enter OTP Here".
Ensure the Verification field is marked as required, then click the Save & Close button.

WS Form - Email Verification Add Verification code field

After adding all the fields, click the Publish button.

WS Form - Email Verification click Save settings

Navigate to the Form Settings page and add the Form ID, Email Field ID, and Verification Field ID.
After that click on the Save Settings button.

WS Form - Email Verification Setting publish

Navigate to your WS Form page and complete all the fields with the required details.
Enter your email, click the Send OTP button, and then enter the OTP you receive in your email.
Then, click on the Submit button.

WS Form - Email Verification Submit form

The WS form will be submitted after successful OTP verification.

Step 3: Change verification button text

Go to the Form settings page.
Enter the text you want to use for the verification button and click on the Save Settings button.

Contents