If you’ve opened registration on your site up to every user, then it will probably be helpful to have an easy to use login form that anyone can access. Login with AJAX lets you add a simple to use and customizable form to the front-end of your site using a widget, shortcode or template tag.

What’s It Do?

For those unfamiliar with what AJAX is, it stands for Asynchronous Javascript and XML. If that didn’t quite clear it up, it basically means that actions can be completed without having to navigate to a new page. The Login with AJAX plugin outputs a simple login form on your site so that users can enter their username and password, and be logged in, without having to visit the admin panel at all. It also gives users quick access to their profile, logout link, and a registration form (assuming you have this enabled). You can customize which parts of this form are shown and where, and choose where to redirect users when they are logged in and out.

But in case you need other forms besides login ones, then you can build them with a tool like HappyForms.

HappyForms is a plugin that enables easy and quick creation of attractive forms, sign-ups, surveys, polls, and checkouts. The forms it produces are lead generation, effective, and conversion-encouraging forms. Best of all, they are built using a high-tech drag-and-drop live form builder.

And on top of all that, besides building the forms, using this plugin, you will be able to track their performance, display live results, and also manage and update the forms all from one dashboard.

Now, back to our main plugin review!

How’s It Work?

After you install and activate the plugin, visit Settings -> Login With AJAX to get it set up. The first is a drop-down menu to select your template. The “divs-only” and “default template” options will show a simple textbox for a username and password with a login button. The “modal” option will show text links to log in, log out, or register, which will open up a pop-up modal window with the text boxes.

There is also an option to “Disable refresh upon login?” By default, the page will be refreshed when users are logged in or out. The reason is that sometimes different content is shown to users that are logged in, so the page has to be refreshed. If this is not a concern for you, you can check this box.

Global settings for the login form

The next section lets you choose where to redirect users when they are logged in or logged out. The first textbox is “Global Login Redirect” where you can specify where users should be redirected after they have successfully logged in. The default behavior is on the page they are currently on, so you can probably leave this alone, but you can also enter a specific URL (like your homepage) or use the shortcode %USERNAME% to direct them to their user profile. The same can be done with “Global Logout Redirect” except here you should put what should happen after users log out. The default for this is the WordPress login page, so it is probably worth changing this to %LASTURL% which will simply redirect to the page the user is currently on.

Below this, you will see a list of user roles (Administrator, Editor, etc.) that are currently on your site. For each user role, you can enter in a redirect different from the default behavior. If you leave this blank, then each user role will simply redirect to the global behavior you specified above.

The last section of the Settings is “Notification Settings.” If you allow open registration on your site, then the login form will have a “Register” link for users that are not logged in. If you’d like, you can override the email new users receive by checking the “Override Default Email?” box and editing the Subject Line and Message of the email body. Not sure if anyone can register on your WordPress site? Visit Settings -> General. If the “Anyone can register” in Membership is checked, then you have open registration and the “Register” link will be included with the plugin’s login form by default.

You can customize your registration email

You can actually add the login form to your site in three different ways. The first is by using it as a widget, going to Appearance -> Widgets and drag the “Login With AJAX” widget to one of your sidebars. From there you can specify what message to show, what template to use, and what links to include (profile link, registration and recover password link).

You can also use a shortcode to add the login form. In that case, you can even show the form even while having a coming soon page active so that your user can still easily log in. On any post or page, simply use this code:

[[login-with-ajax profile_link=1 registration=1 remember=1 template="modal"]]

Change “profile_link”, “registration” or “remember” to 0 in order to remove these links. You can also change the “template” variable to “divs-only” or “default.” If you’d like to just keep the global options on your form, you can simply use the code [[login-with-ajax]] without the parameters.

Lastly, you can use a template tag to insert the login form in your template’s PHP files, again optionally passing parameters to change default behavior:

  $ajaxArgs = array(
    'profile_link' => true,
    'template' => 'modal',
    'registration' => false,
    'remember' => true
    );

  login_with_ajax($ajaxArgs);

To see the login form in action, just visit the page of the site you put it on and log in through there. The interactions are very smooth and everything is set up to be as performant as possible, so users can log in quickly and easily without too much hassle and without having to visit the back-end.

Login form as modal

Costs, Caveats, Etc.

Login With AJAX has support for BuddyPress, Multisites, and SSL should you need it. If you are having problems with the plugin, you can visit the support forums for help.

Resources

• Support Forums
• Notes and Guide to Using the Plugin