How to Setup Passwordless Login (Login by OTP)

The Passwordless Login feature provides your customers with frictionless access without the stress of remembering traditional, complex passwords. This dramatically speeds up return customer conversions and secures logins via single-use secure codes or interactive WhatsApp templates.

1. General Settings (Default Method & Session Security)

Configure the landing state of your login form and define secure session lifetimes for authenticated users.

Default Login Method (login_method)

Choose the landing tab users see first when opening the form:

• Phone Login (phone_login): Direct WhatsApp or SMS verification. Recommended for mobile-first audiences.
• Email Login (email_login): Secure Email Magic Link or password authentication.
• Auto-Fallback: If the chosen default method is not available due to misconfigured gateways or disconnections (e.g., Phone Login is selected but both WhatsApp and Firebase gateways are offline), the system automatically renders the alternative tab instead.

Security & Session

• Session Lifetime Type (session_lifetime_type): Control user session duration. Select Lifetime (Follow WordPress) to inherit standard 14-day login cookies, or choose a custom duration in Minutes, Hours, or Days.
• Lifetime Value (session_lifetime_value): Set the exact number of units for custom timeframe expirations. Only visible and customizable when the lifetime type is set to Minutes, Hours, or Days. Setting this to 0 falls back to the WordPress default duration.

2. Email Login Settings (Magic Link vs. Classic Password)

Decide how email authentications are routed and personalize the email delivery templates.

Primary Email Method (primary_email_method)

Select which flow takes precedence when a user enters an email address:

• Email Magic Link Login (otp): Delivers a secure click-to-login link directly to their inbox.
• Classic Password (password): Standard username and password validation.

Enable Email & Password (enable_email_password)

Switch this toggle to allow users to authenticate using standard WordPress username/password credentials. This adds a password input field as an alternative sign-in method.

Email Magic Link Login / Email OTP Login (enable_email)

Switch this toggle to enable passwordless magic link delivery:

• SMTP Gateway Dependency: This feature requires the Email Sender (SMTP) connection to be configured and active under Sender Settings (/wp-admin/admin.php?page=wawp-senders#tab-email). If disabled, a warning badge is displayed and the toggle is deactivated.
• Subject (otp_subject_email): Enter a custom subject line (e.g., Sign in to {{shop_name}}). Supports personalization tags such as:
  • {{magic_link}} — Generates the secure login link.
  • {{user_name}} — Displays the user's account name.
  • {{shop_name}} — Displays the store name.
• Body Template (otp_email_template_id): Select one of your HTML templates from the dropdown. You can manage templates on the Email Templates page. Click the Manage Templates (Settings Gear) button next to the dropdown to go directly to /wp-admin/admin.php?page=wawp&wawp_section=email_templates. Supported placeholders inside the body template include:
  • {{magic_link}}
  • {{user_first_last_name}}
  • {{shop_name}}
  • {{site_link}}

3. Phone Login Settings (WhatsApp vs. Firebase SMS)

Configure high-deliverability mobile channels to route verification codes or interactive approvals.

Primary Phone Method (primary_phone_method)

Select the default delivery gateway for phone numbers:

• WhatsApp Web Authentication (whatsapp): Use your connected WhatsApp instances for standard OTP texts or one-tap verification list messages.
• Firebase SMS Authentication (firebase): Use Google Firebase API to send SMS codes globally.

A. WhatsApp Web Authentication (enable_whatsapp)

Toggle this gateway to route logins via your WhatsApp connections. This requires at least one online WhatsApp instance under Sender Settings (/wp-admin/admin.php?page=wawp-senders). If no instances are online, the toggle is disabled and a warning is shown.

Preferred Verification Channel (whatsapp_auth_type)

Choose the verification workflow:

1. Standard OTP (otp): Sends a 6-digit text passcode that the user manually inputs on your site.
   • Force Language (whatsapp_otp_lang_type):
     • Auto (Site Locale) (site): Inherits the active WordPress site language.
     • User Context (Dynamic) (user): Inherits the individual user's locale.
     • Forced (Manual Selection) (custom): Locks the template to a fixed language.
   • Select Language (whatsapp_otp_custom_lang): Only visible if Force Language is set to custom. Choose from Arabic, English, Spanish, French, Portuguese, Indonesian, Russian, Turkish, or German.
   • Enable Custom Footer (whatsapp_otp_footer_enabled): Toggle to append custom text at the bottom of the OTP message.
   • Footer Content (whatsapp_otp_footer): Input custom text with emoji support (e.g., Support Wawp Engine).
   • OTP Message Template (otp_message_whatsapp): Edit the raw message content. Make sure to preserve the {{otp}} placeholder. Example: "Your verification code is {{otp}}".

2. Interactive List (One-Tap Verify) (list): Sends an interactive message card directly on WhatsApp. The user simply taps Approve Login or Reject & Report without entering codes.
   • List Title (whatsapp_list_title): Set a bold header for the WhatsApp message card (default: Secure Verification).
   • Main Description (whatsapp_list_desc): Set the card subtitle (default: Verify your identity to continue).
   • Item 1 (Success Action): Customize the approval button details.
     • Action Title (whatsapp_list_item1): e.g., Approve Request.
     • Action Description (whatsapp_list_item1_desc): e.g., This is my login attempt.
   • Item 2 (Reject Action): Customize the rejection button details.
     • Action Title (whatsapp_list_item2): e.g., Reject & Report.
     • Action Description (whatsapp_list_item2_desc): e.g., I don't recognize this.
   • Selection Button (whatsapp_list_button): Label for the dropdown option list (default: Choose Action).
   • Bottom Footer (whatsapp_list_footer): Bottom footer note (default: Secure authentication via Wawp).

B. Firebase SMS Authentication (enable_firebase_sms)

Toggle this gateway to route verification codes via SMS.

• Firebase Configuration Dependency: Requires Firebase API Key and configuration settings to be active under Sender Settings -> Firebase (/wp-admin/admin.php?page=wawp-senders#tab-firebase). If missing, an error badge is displayed.
• External Management: Firebase SMS messages are handled externally. To modify templates or manage costs, visit your Google Firebase Console. To set up Firebase credentials, follow the Firebase SMS Configuration Guide.

4. Post-Login Redirection Rules

Control where users land after a successful authentication event depending on their account roles.

Click Add New Rule to create role-based routing:

• Target User Role (role): Select All Roles (all) or choose a specific role (e.g., Administrator, WooCommerce Customer, Subscriber, Editor, Shop Manager).
• Page Link (redirect_url): Enter the destination URL or local path (e.g., /wp-admin for administrators, or /my-account for customers).
• Empty State: If no redirect rules are defined, users will land on the default WordPress destination page.

5. Style Settings (Themes, Branding & Custom CSS)

Personalize the login form interface to match your website's exact design system.

Enable Premium Design (enable_premium_design)

Switch this toggle on to override the default styles and apply custom branding.

Form Logo & Headers

• Form Logo (logo): Upload a horizontal PNG/SVG with a transparent background to show at the top of the form instead of the site title.
• Form Headline (title): Add welcoming text (default: Welcome back).
• Form Description (description): Add description text with a rich text editor supporting WYSIWYG formatting, lists, and emojis (default: Choose a sign-in method to continue).

Theme Presets (color_theme)

Select from six pre-designed color palettes:

1. Default (WhatsApp Green): Classic WhatsApp style (#22c55e).
2. Wawp Official (Teal): Clean brand teal (#004444) and navy (#141b38).
3. Modern Ocean (Blue/Teal): High-contrast blue (#2563eb) and cyan (#0891b2).
4. Midnight (Dark/Purple): Modern dark purple (#7c3aed) and indigo (#4f46e5).
5. Sunset (Orange/Red): Vibrant orange (#ea580c) and red (#dc2626).
6. Minimal (Black/Gray): Clean monochrome black (#171717) and gray (#d4d4d4).

Detailed Color Customizer

Override background and text colors individually for:

• WA Button: whatsapp_button_color / whatsapp_button_text_color
• Firebase Button: firebase_button_color / firebase_button_text_color
• Email Button: email_otp_button_color / email_otp_button_text_color
• Password Login Button: password_login_button_color / password_login_button_text_color
• Verify Action Button: verify_button_color / verify_button_text_color
• Resend Button: resend_button_color / resend_button_text_color
• Show Password Button: show_password_button_color / show_password_button_text_color
• Back Link: back_button_color / back_button_text_color

Custom Styling (CSS) (custom_css)

Write custom CSS rules to adjust any layout elements (e.g., custom margins, font scales, borders, or animations).

6. Shortcodes & Integrations

Deploy the passwordless login form on any page or integrate it directly into your theme templates.

• Appended Content (Shortcode Manager) (custom_shortcode): Paste external shortcode elements (like Google reCAPTCHA or social login badges) in the settings list to display them directly below the login form.

• Core Login Shortcode: Copy and paste the standard shortcode on any post or page: [wawp_otp_login]
• Developer PHP Hook:

Rate Limiting & Security (Backend Operations)

The Wawp plugin includes built-in backend protections to safeguard your login endpoints against spam and automated abuse:

• IP-Based Rate Limiting: The backend class-wawp-otp-login.php enforces a limit of 3 OTP requests per 60 seconds per individual IP address. Any requests exceeding this threshold will receive a Too many requests error.
• Google reCAPTCHA: If Google reCAPTCHA protection is enabled globally, the frontend login form validates the user token through the Google reCAPTCHA API before authorizing the delivery of an OTP message.
• User Existence Check: If a user enters a phone number or WhatsApp account that does not match any registered WordPress user, the system blocks the OTP and redirects them to the Sign-up page (if configured) with their phone number prefilled in the query parameters (?pre_phone=...).