Advanced JavaScript Usage and Customization

Login With AJAX uses JavaScript for the animations and AJAX behaviour that makes a great login experience! We pride on providing an ultra-flexible plugin for developers, therefore we have multiple ways for you to add to, extend or completely override our JavaScript to adapt your login templates to your needs.

JavaScript Hooks

There are various JS hooks related to the submission of an LWA-powered form, they are fired as an event bound to the document like so:

jQuery(document).trigger('lwa_action-name', [response, form]);

In all cases, the objects passed on by the event can be modified since they are passed by reference, therefore our JS will

Below are a list of hooks with links to further details:

Overriding JavaScript File

You can also completely override our own JS file by copying it into one of the custom template locations. For example, you could copy the JS files like so:

/wp-content/plugins/login-with-ajax/templates/
- login-with-ajax.js
- login-with-ajax.min.js
Copy these to :
/wp-content/plugin-templates/login-with-ajax/
- login-with-ajax.js
- login-with-ajax.min.js

You need to copy/modify both .js and .min.css files as each will display whether or not you're in debug mode.

By copying the JavaScript file over to your custom template location, this file will be loaded instead of the JS file located in our folder.

Debug Mode

When in regular production mode, a minified version of the CSS files will be loaded, meaning the file with the .min.css extension. If you would like to load the regular un-minified version, you can do so by enabling WP_DEBUG mode by making sure the following line in your wp-config.php is set as follows:

define('WP_DEBUG', true);

This line is usually always present, if not, add it to the top of the file below the <?php opening tag.