Follow for free plugins, new theme releases and theme news
Plugin Description
If you need to load your site faster and without any page reloads, then Ajax Press is the right tool for you. Your site will appear faster and more impressively using the Ajax Press plugin.
Ajax Press uses https://developer.mozilla.org/en-US/docs/Web/Guide/AJAX (XmlHttpRequest) and [https://developer.mozilla.org/en-US/docs/Web/Guide/API/DOM/Manipulating_the_browser_history] (pushState) deliver a fast browsing experience to your site users.
It allows you to completely transform the user experience of standard websites to make users feel like they are browsing an app, especially for those with low bandwidth connections.
No more full page reloads. No more multiple HTTP requests.
Ajax Press Features
- Ajax Page Load – Loads your site using AJAX without any page refresh.
- Ajax Search – Users can search your site without any page reload.
- Ajax Comments – Users can post comments on your site without any page reloads.
- Ajax Login – Users can login to your site without any page reloads.
- Ajaxify Forms – You can make any form ajaxify on your site that has an internal action link.
- Page Transition Animatio – Multiple page transition animation is available to add a more attractive page switching mode.
- Preloader – Multiple preloader available to show before the ajax page is loaded.
- Custom JavaScripts – You can execute custom JavaScripts, after every ajax page is loaded.
- Multiple Content Selectors – You can replace multiple content parts/ selectors of your page.
Basic Usage
After activating the plugin, you have to configure the Ajax Press settings from the Ajax Press > Settings page.
If your theme is listed on our predefined list, then you will see an admin notice with a button to install the default settings for your theme.
If your theme is not listed on our predefined list, then you have to set the settings manually for your theme on the Ajax Press > Settings page.
Generally, you have to set the main content container selectors (not header navigation) which will be replaced on every page change. You have to set the main content selector in the Main content selector input box. You can use any valid CSS selector (ID, Class) in the input box.
Example: – #content, #main and .site-content etc.
Developer Tips
-
The vanilla js DOMContentLoaded and jQuery ready event runs every time the ajax request is completed.
-
When the ajax request is start the javascript pjax:send event is fired. You can use this event to execute javascript at the start of the ajax request.
Example : document.addEventListener('pjax:send', function(){...your codes});
-
When the ajax request is completed the javascript pjax:complete event is fired. You can use this event to execute javascript when the ajax request is completed.
Example : document.addEventListener('pjax:complete', function(){...your codes});
-
Use jQuery ready event instead of the ready function to initialize your jQuery codes.
Example : $(document).ready(function(){...your codes});
Not: $(document).ready(...your codes);
Screenshots
Ajax Press Settings
