LCP Ajax Pagination
LCP Ajax Pagination is an add-on plugin for List Category Posts . Many users have requested the AJAX pagination feature and it is now possible with this extension. Two modes are currently supported: Ajax pagination Load more posts IMPORTANT : Requires List Category Posts version 0.84.1 or greater .
About this tool.
LCP Ajax Pagination is an add-on plugin for List Category Posts . Many users have requested the AJAX pagination feature and it is now possible with this extension.
Two modes are currently supported:
- Ajax pagination
- Load more posts
IMPORTANT : Requires List Category Posts version 0.84.1 or greater .
Ajax pagination
Usage: [catlist ajax_pagination=yes]
The result is as if you used [catlist pagination=yes] but clicking pagination links does not trigger page reloads. Instead, new posts are fetched asynchronously and the list is updated without a reload.
No other features of LCP pagination are modified, you can apply your pagination CSS, or other customisations, same as you have before.
Load more
Usage: [catlist ajax_loadmore=yes]
This transforms vanilla LCP pagination by replacing pagination links with a “Load more” link. Note that this first release does not allow specifying how many posts to fetch and uses the numberposts shortcode parameter same as vanilla pagination . This will change in a future release.
You can customise the link’s text using LCP’s pagination_next parameter: [catlist ajax_loadmore=yes pagination_next=”Show more posts”]
General notes
- IMPORTANT : If you have multiple shortcodes on a page, those using AJAX must have the instance parameter set as per the documentation . [catlist ajax_loadmore=yes instance=1]
- You do not have to use LCP’s pagination parameter, using ajax_loadmore or ajax_pagination is enough.
- Make sure your shortcode contains only one option: ajax_loadmore or ajax_pagination , otherwise the plugin will not work.
CSS customisations
The plugin uses the following CSS classes:
- AJAX pagination <ul> has the original lcp_paginator class, this plugin also adds lcpax-pagination .
- Wrapper around the load more link is: <div class="lcpax-nextlink-wrapper"> , the link itself is left unchanged as delivered by LCP, so it has the lcp_nextlink class.
- The SVG spinner displayed while waiting for ‘load more’ to finish has the lcpax-spinner class.
Development
LCP Ajax is open source software. You can find the development version of the plugin on Github .