How to setup OTP Verification for WooCommerce Login Form?

Pre-requisites : Download And Installation

• Download our miniOrange OTP Verification plugin and WooCommerce plugin on your WordPress website.
• OTP Verification on WooCommerce Registration form

Getting started with the setup

Let's explore how to setup WooCommerce Login form for the OTP Verification plugin.

1. OTP Verification on WooCommerce Login Form

You can verify the Users through the Phone or Email verification method.

• Go to the Forms tab in the OTP Verification plugin, then search and select WooCommerce Login Form from the list.

Phone Verification
Email Verification

• Select this checkbox to enable the WooCommerce Login Form.
• Enable the radio button for Phone Verification.

• If you are using a WooCommerce registration form then use billing_phone as the Phone user meta key. If you are using another registration form then the meta key will also change.
• Click on the Save Settings button.

• Go to the WooCommerce login form and enter your login credentials.
• Then, click on the Login button.

• You will get a popup to validate the OTP. OTP will be sent to the phone number associated with that user.
• Enter the OTP and click on Validate OTP button.

• The user will be successfully logged into the account once successful OTP verification.

Allow the user to add a phone number if it does not exist

• When the user does not have a registered phone number associated with their account, the user can enable the 'Allow users to add phone number if it does not exist" checkbox'.
• Click on the Save Settings button.

• Navigate to the WooCommerce Login Form.
• Enter your login credentials and click on the Login button.

• If user don't have a phone number registered with their account then they will get a pop-up to register the phone number.
• In that, the user enters their phone number and clicks on the Send OTP button.

• OTP will be sent to the registered phone number. The user must input the OTP received on that phone number.
• Click on the Validate button.

• The user will be successfully logged into the account once OTP verification.

Allow users to login with their phone number.

• When a user wants to login with their phone number, Check the enable 'Allow users to login with their phone number' option.
• You have the option to edit the text for the Username Field.
• Click on the Save Settings button.

• Navigate to the WooCommerce Login Form.
• Enter your Username/Email/Phone Number and Password and click on the Login button.

• You will get a popup to validate the OTP. Enter the OTP received in your phone/Email and click on the Validate OTP button.

• The user will be successfully logged into the account once successful OTP verification.

Prevent multiple accounts with the same phone number

• To prevent users from using the same phone number across multiple accounts, select the checkbox 'Do not allow users to use the same phone number for multiple accounts'.
• Click on the Save Settings button.

• If a user attempts to use the same phone number for multiple accounts, the user will receive an error message.

• Select this checkbox to enable the Ultimate Member Login Form.
• Enable the radio button for Email Verification.
• Click on the Save Settings button.

• Go to the WooCommerce login form and enter your login credentials.
• Then, click on the Login button.

• A popup will appear for OTP validation. The OTP will be sent to your email associated with that user.
• Enter the OTP and click on Validate OTP button.

• The user will be successfully logged into the account once successful OTP verification.

2. Advance settings for Phone & Email verification

Allow users to login with a password and OTP (2FA)

• Navigate to the Advanced Settings for Phone and Email Verification.
• Select the Login with Password and OTP (2FA) option.
• Click on the Save Settings button.

• Navigate to the WooCommerce Login Form.
• Enter your login credentials and click on the Login button.

• You'll receive a popup to verify the OTP. Enter the OTP received in your phone/Email and then click on the Validate OTP button.

• The user will be successfully logged into the account once successful OTP verification.

Allow users to login with only OTP

• In this feature, users will be able to log in without a password (Passwordless Login). User will need to enter the Username/Phone Number/ Email address of their account and OTP will be sent to their Phone Number or Email address based on the OTP type enabled.
• Select the Login with OTP only option.
• Click on the Save Settings button.

• Navigate to the WooCommerce Login Form.
• Enter your Username and click on the Login button.

• You will get a popup to validate the OTP. Enter the OTP received in your phone/Email then click on the Validate OTP button.

• The user will be successfully logged into the account once successful OTP verification.

Allow users to login with Username and Password

• With this option, users can choose to log in either using an OTP alone or with a username and password.
• Select the Login with OTP only setting.
• Select the option Allow users to log in with Username and Password.
• Click on the Save Settings button.

• Navigate to the WooCommerce Login Form.
• If you have to login with a Password, enter your Username and click on the Login with Password button.

• Now you will see a field for the password. Enter your password in it and click on the Login with Password button.

• The user will be successfully logged into the account.

Allow the Administrator to bypass OTP verification during the login

• In this feature, the administrator will not be asked for OTP verification while logging in.
• After that, check the enable 'Allow the administrator to bypass OTP verification during the login' option.
• Click on the Save Settings button.

Delay OTP Verification

• With this feature, the OTP verification will not be prompted until the interval entered by the user while logging in.
• Enable Delay OTP Verification setting.
• Enter the interval at which you want OTP Verification to be invoked for users.
• Click on the Save Settings button.

Select Redirection after login

• Navigate to the Select Redirect after login feature.
• If the user wants to redirect to the default page after login, enable the 'Redirect to Default page (Current Page)'' option.
• Click on the Save Settings button.

• If the user wants to redirect to the selected page after login, enable the Select Redirection page option.
• Then, select a page from the list of the dropdown.
• Click on the Save Settings button.

• After you login you will be redirected to the selected page.

Advance Settings

• How to show country code drop-down on your form?
• How to change SMS and Email Template?
• How to change OTP Length and Validity Period?
• How to change the design of the OTP popup?