Mobile Login for Magento 2 © Meetanshi
Mobile Login for Magento 2
User Guide
Table of Content
1. Extension Installation
2. Configuration
3. API Settings
4. API Testing
5. OTP Custom SMS Settings
6. Synchronize Telephone Number with Mobile Number
7. Form Title Texts
8. Form Layout Settings
9. Country Flag Settings
10. Mobile Login in Frontend
Mobile Login for Magento 2 © Meetanshi
1. Extension Installation • Create a folder structure in Magento root as app/code/Meetanshi/Mobilelogin
• Download and extract the zip folder and upload our extension files to the
app/code/Meetanshi/Mobilelogin via FTP.
• Login to your SSH and run below commands step by step:
o php bin/magento setup:upgrade
o For Magento version 2.0.x to 2.1.x - php bin/magento setup:static-content:deploy
o For Magento version 2.2.x & above - php bin/magento setup:static-content:deploy –f
o php bin/magento cache:flush
Note: Don’t forget to install Twilio library even if you are not using Twilio SMS gateway for our
extension.
2. Twilio Registration If you are going to use Twilio as an SMS gateway to send OTP, you need to register with the
Twilio to get Account SID, Auth Token and Twilio Phone Number.
• First of all, Sign Up for the Twilio account. Add the details and click to get started.
Mobile Login for Magento 2 © Meetanshi
• After the Email verification, enter your mobile number and click to “Verify”.
• Once you click “Verify”, you will get an OTP on the added mobile number. Enter the OTP
and verify the mobile number. Now move to Settings → General where you can see API
details both for live and testing. Copy the Account SID and Auth Token to use them in
Magento backend configuration for Twilio account.
Mobile Login for Magento 2 © Meetanshi
• Now, click three dots from the left sidebar, go to Programmable SMS and click Build
under the Learn and Build option. From here, you can get Twilio phone number to use
for sending the SMSs. Click on the “Get a number” button.
• You will get a number to choose. Click “Choose This Number”.
• Once you click the button, you will get a Twilio phone number. Copy this number and
set it in the Magento backend configuration for Twilio account.
Mobile Login for Magento 2 © Meetanshi
3. Msg91 Registration The extension allows configuration of the Msg91 SMS gateway to send OTP for the mobile
verification. If you choose to use Msg91 SMS gateway integration, follow the steps below to get
sender ID and API key.
• Visit https://control.msg91.com/signup/. Enter the details and click to sign up.
Mobile Login for Magento 2 © Meetanshi
• You will get and code or a magic link in the Email to verify the Email address.
• You will be asked to enter the mobile number for verification.
Mobile Login for Magento 2 © Meetanshi
• Enter the OTP to verify the mobile number and you will be registered successfully. Login with the credentials.
Mobile Login for Magento 2 © Meetanshi
• Under the settings, you can find the Sender ID which you need to copy and paste in the Magento configuration.
Mobile Login for Magento 2 © Meetanshi
• Now move to API, where you can find the API key for the Magento configuration.
• You can find the Message type under the Send SMS tab. Select the SMS type in Msg91 configuration in Magento as per your requirement.
Mobile Login for Magento 2 © Meetanshi
4. Configuration For configuring the extension, login to Magento 2, move to Stores → Configuration → Mobile
Login where you can find various settings to enable the extension.
• Mobile Login: Enable the Mobile Login extension.
• OTP Type: Set the OTP type from the drop-down menu.
• OTP Length: Set the OTP length.
5. API Settings Configure the API settings using the details received while registering with the SMS gateway:
• API Provider: Select API provider to integrate the extension with the preferred SMS
gateway to send SMS.
• Sender ID: Add the sender ID.
• Message Type: Select the message type to be sent to customers from the drop-down
menu.
• API URL: Add the API URL.
o For Msg91: http://api.msg91.com/api/sendhttp.php
o For Textlocal: https://api.textlocal.in/send/
• Authorization Key: Add authorization key received while registration with the SMS
gateway.
Mobile Login for Magento 2 © Meetanshi
6. API Testing The extension facilitates to test the API connection after the API Settings are configured. Simply
add the mobile number with the country code, save the configuration and then click on the
“Send” button to get the test SMS.
7. OTP Custom SMS Settings
Set the following OTP SMS texts to send OTP SMS for the verification of mobile number on
various events. • Login OTP SMS Text: Enter SMS text to send OTP for login.
• Registration OTP SMS Text: Enter SMS text to send OTP for registration.
• Forgot Password OTP SMS Text: Enter SMS text to send OTP for reset password.
• Update Mobile Number OTP SMS Text: Enter SMS text to send OTP for customer mobile
number update.
Mobile Login for Magento 2 © Meetanshi
8. Synchronize Telephone Number with Mobile Number
If your store already has existing customers and you don’t want them to sign up again
to use mobile login facility, the extension avails synchronization facility using which the
telephone numbers added while registration will be synched as mobile number and
your existing customers can use mobile login facility without signing up again. Click on
Sync Now button to sync telephone number fields with mobile numbers.
Mobile Login for Magento 2 © Meetanshi
9. Form Title Texts You can set custom titles for the various forms.
• Login With OTP Title: Enter title for the login with OTP form.
• Login With Password Title: Enter title for the login with password form.
• Create Account Title: Enter title for the create account form.
• Forgot Password Title: Enter title for the forgot password form.
10. Form Layout Settings The extension facilitates to design the form layout as per your need. Configure various settings
to design form layout. • Upload Image: Upload image to show in the left side of the form.
• Button Text Color: Set text color for the button in the form.
• Button Background Color: Set background color for the button.
• Bottom Border Color 1: Set color for the 1st border in bottom of the form.
• Bottom Border Color 2: Set color for the 2nd border in bottom of the form.
Mobile Login for Magento 2 © Meetanshi
11. Country Flag Settings
You can enable the country flag for the mobile number fields in various forms. This
helps users not to enter the country code while adding their mobile numbers. • Enable: Enable country flag in various mobile login forms.
• Allowed Countries: Select countries for which you want to show the flag and allow users to
add mobile numbers.
• Default Country: Set default country to show the default selected flag.
Mobile Login for Magento 2 © Meetanshi
12. Mobile Login in Frontend
• Registration with OTP
On click of “Create an Account” from the frontend, a sign-up form gets opened for the users
to add details and register by verifying mobile number using OTP.
Mobile Login for Magento 2 © Meetanshi
• OTP SMS for Registration When a user enters mobile number along with the other sign up details, a verification SMS
having OTP is sent to the registered mobile number.
• Mobile Number Verification Using OTP for Registration
Users need to enter and submit OTP for registration and verify the mobile number for the
successful signup.
Mobile Login for Magento 2 © Meetanshi
• Login with OTP The user can login with OTP using mobile number verification. Users simply add the
registered mobile number and request OTP for the mobile verification.
• Mobile Number Verification Using OTP for Login
Same as the registration process, the OTP SMS is sent to users registered mobile number.
Users need to enter and submit OTP for login and verify the mobile number for the
successful login.
Mobile Login for Magento 2 © Meetanshi
• Login with Password
Apart from the login with OTP, users can opt to login using a password. They can Enter
either Email ID or mobile number along with the password here to login.
• Reset Password with OTP
The users can click “Forgot Password” from the login form to reset the password after
mobile number verification. Enter the registered number, click request OTP to reset the
password.
Mobile Login for Magento 2 © Meetanshi
• OTP Verification for Forgot Password
Same as the registration and login process, the OTP SMS is sent to users registered mobile
number. Users need to enter and submit OTP to verify the mobile number and reset the
password.
• Reset Password
Once the mobile number is verified, the user can reset the password.
Mobile Login for Magento 2 © Meetanshi
• Mobile Number Update from My Account
The users can add or update mobile number from their My Account section under “Update
Mobile Number” tab. Add a new mobile number, click Request OTP to get verification OTP
message, verify the new mobile number by adding the OTP and your mobile number is
updated.