Install the WooCommerce login with mobile number plugin and allow your customers to register and login into your online store directly with their mobile phone number.
- Download Registration & Login with Mobile Phone Number and have your .zip file
- At the WordPress admin panel, go to the Plugins section, and click ‘Add New’ to upload and install the WooCommerce force login before checkout plugin you just downloaded from WooCommerce.
- Upload the .zip file to proceed with the installation.
- Wait until the plugin installs. After successful installation, activate the plugin, and move on to configuration settings.
First of all you need to create account on Google Firebase
and create the app there. Watch this video on How to Create App on Google Firebase Console
At the admin panel WooCommerce > Settings
and click Login with Phone
. Here you find multiple tabs i.e.: General, Firebase, Labels & Fields
, and Messages
Click on the General tab here you can configure the following settings of the WooCommerce checkout login plugin.
- Select your Country (Select countries you want to enable login with your phone number and leave it empty to allow all the countries)
- Hide Default Login form at Account Page (Check this to hide the default login form on the account page)
- Hide reCAPTCHA (Option to disable reCAPTCHA for customers during login with phone number)
- How to Login Already Registered User (Choose how already registered users can log in) You can choose from the following options:
- Send OTP
- Show Password Field
- Enable OTP Timeout (Check this to enable the OTP timeout countdown)
- Enable Failed OTP Restriction (Select this to enable failed OTP restriction)
- Enable Login Count Restriction (Check this field to enable login count restriction)
- Enable Email Account Restriction: (if checked, Users will be required to have an email account as well, first time only)
After configuring the general
settings, click on the firebase
tab to configure the following.
- API key: (Enter the API key here which you have got from Firebase account)
- Auth Domain:(Enter the Auth Domain here which you have got from Firebase account)
- Database URL: (Enter the Auth Domain here which you have got from Firebase account)
- Project ID: (Enter the Project ID mentioned on Firebase account)
- Storage Bucket: (Enter the Storage Bucket from Firebase account)
- Message Sender Id: (Enter the Project ID from Firebase account)
- App Id: (Enter the App ID here which you have got from Firebase account)
- Measurement Id: (Enter the Measurement ID here which you have got from Firebase account)
Now click labels & fields
tab to configure the following.
You can configure the color of the following button elements:
- Main Form Heading Text (Customize the main heading text of login with phone form)
- Phone Number Field Placeholder (Option to add a custom text for the placeholder e.g. Enter Your Phone Number)
- Send Code Button Text (Customize text for send code button)
- Verify Code Placeholder (Option to add a custom text for the placeholder e.g. Verify Your Code)
- Verify Code Button Text (Customize text for verify code button)
- Add Login Button Text (Set text for add login button)
- Change Login Button Text (Specify text for change login button)
After configuring the labels & fields tab click on the messages tab, here you can configure the following.
- Phone/Verify OTP Button Background Color
- Phone/Verify OTP Button Text Color
- Registration Popup Active Tab Button Color
- Registration Popup Active Tab Text Color
- Registration Popup Tab Button Hover Color
- Registration Popup Tab Text Hover Color
- OTP Countdown Message Text Color
In this tab, you can configure the following OTP email settings:
- Phone Number Error Text (This message will be shown when the phone number field is empty)
- Sent Verification Code Message (This message will be shown when the Authentication message is sent)
- Authentication Code Error Message (This message will be shown when an Invalid code is entered)
- Too Many Login Attempts (This message will be shown when a user attempts login many times with the same number or from the same IP address)
- Invalid Phone Number (This message will be shown when the user Enter an invalid Phone Number)
- Successful Verification Text at Registration ( This message will be shown, after successful verification)
- Successful Verification Text at Login (This message will be shown, after successful verification and Logging In)
- OTP Repeated Failure Error Text (This message will be shown on repeated OTP verification failure)
- Repeated Login Error Text (This message will be shown after the login limit is reached)
- OTP Countdown Message (This message will be shown with the OTP countdown timer)
- Registration Popup Message (This message will be shown in the registration popup message)
- OTP Email Account (Enter the email you want to use to send OTP emails to the customers)
- OTP Email Subject (Set the email subject for the OTP email)
- OTP Email Body (Enter the email body you want to set for the OTP email)
No, you don’t have to create an account to log in. The WooCommerce login with OTP plugin allows customers to log in to your store by just entering their phone number and verifying OTP to log in.
- Do I have to create an account to log in with the phone number?
The WooCommerce mobile login plugin enables already registered visitors to log in with two options. You can either select OTP verification or password verification for already registered customers. To do so, go to WooCommerce > Settings > Login with Phone. Here go to the general settings tab and select the verification method for registered users.
- Can already registered users log in with their mobile phone numbers?
Yes, after OTP verification with the WooCommerce OTP registration plugin, customers will be given two choices. They can either register as new users or link their phone number with an existing account. This allows the website visitors to easily update their existing accounts and log in with their phone numbers.
- Can users associate their phone numbers with an existing account?