Linux 软件免费装
Banner图

AJAX Loading

开发者 maheshmthorat
更新时间 2026年10月30日 18:19
捐献地址: 去捐款
PHP版本: 7.4 及以上
WordPress版本: 7.1
版权: GPLv3
版权网址: 版权信息

标签

ajax navigation page loading spa page transitions

下载

1.0 0.1 0.2 1.1 2.0.0

详情介绍:

AJAX Loading makes moving around your site smoother. When a visitor clicks a link, the plugin loads the next page in the background and swaps in only the part that changes, usually the main content area. The header, menus and footer stay in place, so there is no white flash between pages. Every page is still a normal WordPress page with its own address. Visitors who open a link in a new tab, search engines and browsers without JavaScript get exactly the same server-rendered page as before. Whenever the plugin is not sure it can show a page correctly, it lets the browser load that page the normal way. Version 2.0 is a complete rewrite. It no longer needs jQuery, it replaces only the content area instead of the whole page, and scripts on the new page now run properly. If you are upgrading from 1.x, your settings are migrated automatically (see the Upgrade Notice). Navigation engine Loading indicators and page transitions Performance (opt-in) SEO Accessibility Compatibility Built-in integrations re-initialise popular plugins after each navigation. Each one can be set to Auto (built-in handling), Exclude (pages that contain it load normally) or Off (no special handling) on the SEO & Integrations tab. Safety and troubleshooting For developers Full documentation (user guide, troubleshooting, migration from 1.x and the developer guide) is included in the plugin's docs folder. Privacy

安装:

From your dashboard
  1. Go to Plugins → Add New Plugin and search for "AJAX Loading".
  2. Click Install Now, then Activate.
  3. Open Settings → AJAX Loading.
Manually
  1. Download the plugin zip from WordPress.org.
  2. Go to Plugins → Add New Plugin → Upload Plugin, choose the zip and click Install Now (or unzip it into /wp-content/plugins/ajax-loading/).
  3. Activate it on the Plugins screen and open Settings → AJAX Loading.
First steps AJAX navigation is switched on for all visitors as soon as the plugin is activated. To be careful:
  1. On the Overview tab, click Test mode (administrators only) so visitors keep normal page loads.
  2. On Tools & Diagnostics, run Check content selectors and Test navigation.
  3. Browse your site as an administrator. When everything works, click Enable for everyone.
  4. If you use a page cache, purge it after activating the plugin and after changing its settings.

屏幕截图:

  • General: activation, test mode, desktop and mobile, content detection (automatic, custom selectors or whole body), header and footer behaviour, and forms.
  • Loading Experience: loading indicator and page transition settings with the live preview.
  • Exclusions: your URL patterns, link selectors and post types, protected areas, pattern syntax help and the rules that are always applied.
  • Tools & Diagnostics: compatibility check, environment report, recent navigation errors, safety and debugging options, and export, import and restore defaults.

升级注意事项:

2.0.0 Complete rewrite. Your on/off setting is kept, and jQuery loading and emoji removal stay on as in 1.x. Purge your page cache after updating. To go back, install 1.1 from the plugin's Advanced View page; it reads the same on/off setting. Needs WordPress 6.0+ and PHP 7.4+.

常见问题:

Does it work with my theme? Which part of the page is replaced?

By default the plugin finds your theme's main content area automatically (for example #content, main or .site-main) and replaces only that. If two pages use different layouts, the second page simply loads normally. To see what is detected, go to Settings → AJAX Loading → Tools & Diagnostics and click Check content selectors. If the wrong area is found, either add the attribute data-ajax-loading-container to your theme's content wrapper, or choose Custom selectors under General → Content regions and enter the selector of the area to replace.

A slider, form or widget stops working after navigation

Scripts that set things up when a page first loads have to run again after an AJAX navigation. Try these in order:

  1. If it belongs to a plugin listed on SEO & Integrations, make sure that integration is set to Auto.
  2. If only some pages are affected, set the integration to Exclude, or add those pages to your exclusions, so they load normally.
  3. Re-initialise it from your own code after each navigation (example below).
  4. As a last resort, turn on General → Advanced → Fire page-load events again (some scripts may then start twice).
Example for step 3 (the event fires once after every successful AJAX navigation, never on the first page load): document.addEventListener( 'wp_ajax_load_complete', function ( event ) { /* start your slider inside event.detail.container */ } ); The developer guide in the plugin's docs folder has more recipes.

How do I make a page or a link load normally?

  • For one link or a whole area in your templates: add the attribute data-no-ajax or the class no-ajaxy (also no-ajax) to the link or to a parent element.
  • For URLs: add patterns under Exclusions → Excluded URLs, one per line. For example /members/ excludes that page and everything below it, /shop/* excludes everything under /shop/, and download= excludes any URL containing that text.
  • For links matched by CSS: add selectors under Exclusions → Excluded links.
  • For a whole content type: tick it under Exclusions → Excluded post types.

Does it work with WooCommerce?

Yes. Shop, category and product pages load with AJAX and the WooCommerce integration re-initialises galleries, variation forms, tabs and sorting. With the default Exclusions → Protect WooCommerce pages option, cart, checkout, My Account and order pages load normally, so payments, sessions and nonces behave exactly as without the plugin. Add-to-cart, remove-from-cart, coupon and logout links are not intercepted either, and WooCommerce's own AJAX add-to-cart buttons keep working. Keep this option on unless you have tested those pages with AJAX navigation.

Is it bad for SEO?

No. Every URL remains a real page rendered by WordPress, links stay normal links, and the plugin does not show search engines anything different from what visitors get (no cloaking, no #! URLs). It only adds a small <meta name="ajax-loading"> tag, its script and its stylesheet to your pages (and, by default, turns off WordPress's speculative loading rules on those pages). For visitors, the title, meta tags, canonical URL, hreflang links and structured data are updated on every navigation, so share buttons, browser extensions and analytics see the right values.

Does it work with caching plugins?

Yes. The plugin requests pages exactly as a browser does, without special headers, so your page cache serves them as usual. Two things to keep in mind:

  • Purge the page cache after activating or updating the plugin and after changing its settings. Cached copies from before can make navigations fall back to normal page loads. When the plugin detects a page cache, its notices remind you after each change.
  • If an optimisation plugin delays, combines or defers JavaScript and navigation stops working, exclude the AJAX Loading script (assets/dist/frontend.min.js, handle ajax-loading-WPajaxLoad) and its inline configuration from those features.

Will my analytics still count page views?

By default (Automatic), the plugin sends nothing itself. Google Analytics 4 with Enhanced Measurement ("Page changes based on browser history events") or a Google Tag Manager History Change trigger counts each navigation. You can instead let the plugin send a GA4 page_view event or push a Tag Manager dataLayer event (SEO & Integrations → Analytics). Use only one method; if you choose the GA4 option, turn off the history-based page views in GA4, otherwise every navigation is counted twice.

How do I turn it off temporarily?

On the Overview tab you can Turn off AJAX navigation, Pause it for 1 or 24 hours, switch to Test mode (administrators only), or turn on safe mode. All of these keep your settings.

I use the wp_ajax_load_complete callback from version 1.x. Does it still work?

Yes. A global function named wp_ajax_load_complete is still called once after every successful AJAX navigation (never on the first page load). It now runs as soon as the navigation has finished instead of about one second later, and it receives the navigation details as its first argument. New code should listen for the wp_ajax_load_complete event instead, which allows several listeners.

Is jQuery still required?

No. The new script has no dependencies. Sites upgraded from 1.x keep loading jQuery (setting General → Advanced → Load jQuery for custom callbacks) because old custom callbacks often use it; turn it off if your own code does not need it.

Where is the source code of the minified files?

The readable source is in assets/src/, and an unminified build is shipped as assets/dist/frontend.js (loaded automatically when SCRIPT_DEBUG is on). The build tools are in package.json and tools/build.mjs: run npm install, then npm run build.

更新日志:

2.0.0 Complete rewrite of the plugin. New: Fixed: Changed: 1.1 1.0 0.2 0.1