Searching for a WordPress email login feature so that you can customize your site’s login process, such as requiring users to use their email address instead of a username?
By default, WordPress lets users log in with either their username and password or their email and password via the default login page.
But if you want to create a more user-friendly login experience, there are a few ways that you can optimize how WordPress email login works.
In this post, we’re going to show you a few different tactics that you can implement to improve email-based login on WordPress. Here’s everything that we’ll cover:
- Force users to log in with email only. Instead of letting users enter their username or email (in addition to their password), you can force users to only log in with their email and password.
- Create and customize a front-end login form. This lets you make it clearer to users that they can log in using their email address while also creating a more user-friendly login process.
- Set up passwordless login. Instead of having users log in by entering their email address and password, you can just have them enter their email address and then send them a special link via email that lets them log in without ever entering a password.
- Require users to confirm their email address upon registration. This helps you avoid typos or users accidentally entering the wrong email address.
- Create a custom edit profile form. This lets users edit their email addresses from the front-end of your site – you can even require manual admin approval before the change goes live.
Best of all, you’ll be able to do most of this for free!
Keep reading to learn how to set everything up…
What You Need to Customize WordPress Login, Registration, and Edit Profile
To follow these tutorials, you can use the free Profile Builder plugin, which is available at WordPress.org.
Profile Builder is a complete solution for customizing everything about the WordPress login, registration, and edit profile process. You’ll be able to create more user-friendly experiences for your users while also getting access to lots of useful backend features to control how your site’s user profile system functions.
Profile Builder Pro
The best plugin to customize WordPress email login, registration, and edit profile behavior.
To follow most of these tutorials, all you’ll need is the free version of Profile Builder. In a few spots, you might need the premium version for certain features, but we’ll be sure to let you know when that’s the case.
To get started, make sure to install and activate the free Profile Builder plugin from WordPress.org. Then, keep reading to learn how to use it to customize your site’s login and registration processes.
How to Customize WordPress Email Login Behavior
In this first section, we’ll show you how you can create your own custom WordPress login system, like requiring users to use their email address instead of their username.
Add a Front-End Login Form
By default, WordPress includes a login form at yoursite.com/wp-login.php that looks something like this:
This login page is fine if you’re the only person logging into your site, but it’s not a good option if you allow public registration because it doesn’t match the rest of your site and the URL is hard to remember.
To fix this, Profile Builder lets you create your own custom login form that you can add anywhere on your site.
To get started, create a new page or edit the page where you want to add your login form. For example, you could create a new page called “Login”.
Then, add the [wppb-login] shortcode where you want your login form to appear. You can also add other content alongside your login form according to your preferences:
And just like that, you’ll have a front-end login form that matches the rest of your theme:
If you’re using the popular Elementor page builder plugin, Profile Builder also adds its own login widget that you can use to add your login form to an Elementor design and style it using Elementor’s many style options.
Require Users to Log In Using Their Email
By default, WordPress lets users log in with either their username or their email. Profile Builder will use this same behavior for your custom login form at first. However, you also have the ability to change it so that users are required to use their email address instead of their username.
To configure this, go to Profile Builder → Settings. In the General Settings tab, scroll down to the Allow Users to Log in With drop-down and choose your desired configuration.
To make it so that users can only log in by using their email address (and not their username), set the drop-down equal to Email:
If you set it to email only, the text on your login form will automatically change from “Username or Email” to just “Email”:
Customize Your Login Form Behavior
In addition to letting you force users to log in with their email, Profile Builder also gives you some other options to customize the behavior of your front-end login form. You can make these configurations by modifying the [wppb-login] shortcode.
One option is to redirect users to a certain page after they use the login form (like a front-end edit profile form, which Profile Builder also lets you create). You can do this by adding the redirect_url parameter to the shortcode. For example:
[wppb-login redirect_url="http://www.yourdomain.com/page"]
You can also redirect users after they log out by using the logout_redirect_url parameter. For example:
[wppb-login logout_redirect_url="http://www.yourdomain.com/page"]
Another customization that you can make is to add links underneath your login form to send people to your registration form or your password recovery form:
register_url– the URL to your custom registration form. We’ll show you how to create one in the next section.lostpassword_url– the URL to your password recovery form. You can make a front-end password recovery form by creating a new page called “Password Recovery” and adding the shortcode.
For example:
[wppb-login register_url="/register" lostpassword_url="/recover-password"]
Here’s what your login form might look like with these added links:
Enable WordPress Passwordless Login by Email
As an alternative to having users log in with their WordPress email and password, Profile Builder can also help you set up a technique called passwordless login.
With passwordless login, users can log in using just their email address without the need to enter a password.
Here’s how it works:
- A user goes to your login form.
- They enter their email address in the form – no need to add a password.
- Your site sends them an email with a special link.
- Users click that link to log in to WordPress.
This method is still secure because it requires users to have access to the email account associated with their account – there are even some arguments that passwordless login is more secure than traditional login because it eliminates the risk that a malicious actor could steal or guess the password of a person’s user account.
The neat thing is that you don’t have to completely replace the traditional login system if you don’t want to. Instead, you can still offer both traditional “email + password” login and traditional passwordless login and users can choose the method that they find to be more convenient.
To set up passwordless login on WordPress, you can use the free Passwordless Login plugin alongside Profile BUilder.
To get started, install the Passwordless Login plugin from WordPress.org along with the core Profile Builder plugin if you haven’t done so already.
Once you’ve done so, you can add the passwordless login form anywhere on your site using the [passwordless-login] shortcode.
You could even add it to the same page with your custom login form and explain that users can use their preferred approach:
Here’s how that might look on the front-end of your site:
How to Customize the WordPress Registration Form
Everything that we showed you above is useful for customizing WordPress email login behavior for users that already have accounts on your site. However, you also might want some options to customize email behavior when users register.
For example, you could make it so that users need to confirm their email to create an account, which can ensure that users enter a working email and don’t make a typo.
Those are the types of tweaks we’ll cover in this section…
Create Your Custom Registration Form
To control the form fields on your registration form, you can go to Profile Builder → Form Fields.
The free version of Profile Builder lets you use all of the native WordPress profile fields (including an email field), while the premium version lets you add your own custom fields to your registration form and even create multiple unique registration forms.
You can use the interface to add, remove, or edit fields. You can also use drag-and-drop to rearrange the order of the fields.
If configured Profile Builder to only let users log in with their email, it will automatically hide the username field on the front-end of your registration form:
If you want to make sure users enter a valid email, you can use the Email Confirmation field so that users need to enter their email twice (and have the fields match) to submit the registration form.
Once you’re happy with how your form works, you can add your register form anywhere on your site by using the [wppb-register role="author"] shortcode, where the role equals the user role that you want to assign to users who register via this form.
Here’s an example of what it might look like with both the email field and the email confirmation field:
Require Users to Confirm Email When Registering in WordPress
To make sure users enter a valid email address when they register, Profile Builder lets you require users to verify their email addresses by clicking a link before they can create their accounts.
To enable this feature, go to Profile Builder → Settings and set the “Email Confirmation” Activated drop-down equal to Yes.
When you make this choice, you’ll also see another option to choose the confirmation page. This is the page that users will see after they click the confirmation link in their email. You can create it using a regular WordPress page and then select it using the drop-down:
How to Create a Custom Profile Edit Form to Let Users Change Their Email Addresses
In addition to creating custom login and registration forms, Profile Builder can also help you create front-end edit profile forms to let users edit some or all of their profile information, including their login email.
The key thing here is that users can do this from the front-end of your site, whereas they’d normally need to change their email from the backend WordPress dashboard.
With the free version of Profile Builder, users will be able to edit all the fields that are on your registration form. Or, if you upgrade to the premium version, you can create a separate edit profile field that includes a different list of fields.
To add your edit profile form anywhere on your site, you can use the [wppb-edit-profile] shortcode. Here’s an example of what it might look like:
With the premium version of Profile Builder and the Edit Profile Approved By Admin add-on, you also have the option to require certain profile changes to receive admin approval. For example, you could give users the option to change their email address but require those changes to receive manual admin approval before they’re live:
Create Your WordPress Email Login System Today
By default, WordPress includes a simple login and registration system that lets people use either their username or email address.
If you want to get more control over how that system works and create a more user-friendly login and registration system, you can use the free Profile Builder plugin.
Profile Builder lets you create your own custom login and registration forms, complete with adjustments to the default behavior such as disabling username usage and requiring users to log in and register using just their email addresses.
If needed, you can also adjust other behavior such as requiring users to confirm their email address on the registration form and also click a verification link in an email before they create their account.
You can also let users edit their email addresses from the front-end of your site and, with the premium version, require manual admin approval before those email changes are live.
If you want to test it out, install the free version of Profile Builder from WordPress.org today. Then, upgrade to the premium version to access lots of useful features including:
Profile Builder Pro
The best plugin to customize WordPress email login, registration, and edit profile behavior.
Still have any questions about controlling WordPress email login behavior with Profile Builder? Ask us in the comments!
Source: https://www.cozmoslabs.com/312482-wordpress-email-login/
