How to Add WordPress Ajax Login Forms to Your Site
If you are unfamiliar with the term Ajax, it is the technology that enables the submission of web forms to be processed without the page being refreshed or reloaded.
The default WordPress login form is not Ajax-ified in that a page reload is required to process each login request. This also holds true for a lot of plugins that allows front-end custom login form.
In this tutorial, I will be walking us through the process of creating an Ajax login form and finally, how to add it as a widget to your website sidebar and make it your default login page using the powerful ProfilePress plugin.
Table of Contents
Building the Ajax Login Form
We have the steps in building a custom login form with ProfilePress covered already. To enable ajax for all ProfilePress login, registration and password reset forms:
- Click the
Settings
ProfilePress menu and scroll to theGlobal Settings
section. - Ensure the
Disable Ajax Mode
checkbox isn’t checked. If it is, uncheck it.
- It is that easy.
Making the Ajax Login Form Your Login Page
After enabling Ajax for all ProfilePress powered forms, to make your preferred login form your default WordPress login page:
- Copy the shortcode of the registration form and save it to a page.
- Still on
Global Settings
, set the page above as the Registration Page.
Afterwards, every visit to https://yoursite.com/wp-login.php
will be redirected to the above page.
Adding an Ajax Login Form Widget to WordPress Sidebar
Navigate to Appearance >> Widgets, drag the ProfilePress Form widget to your website sidebar, select your chosen registration form from the dropdown and save.
Preview your WordPress site to see the login form displayed on the front-end of your site.