Contents
Overview
bs Load More extends Bootscore’s loop with a Load More button that fetches and appends the next batch of items without a page reload. Works with all bs Loop layouts and is compatible with bs Swiper and bs Isotope.
Installation
- Download Plugin
- In your admin panel, go to Plugins > and click the Add New button.
- Click Upload Plugin and Choose File, then select the Plugin’s .zip file. Click Install Now.
- Click Activate to use your new Plugin right away.
Theme
The plugin adds a Load More button to Bootscore’s native loop in archive.php, index.php, and search.php, replacing the default pagination. The number of items shown and loaded per click is controlled globally in:
wp-admin → Settings → Reading → Blog pages show at most X posts
- Set it to
2— shows 2 items, loads 2 more per click - Set it to
12— shows 12 items, loads 12 more per click
Button
The Load More button is rendered directly below the loop wrapper. It shows a Bootstrap spinner while loading, then re-enables with “Load more” text, or becomes disabled with “No more items” text when all items have been loaded.
Button and wrapper classes are filterable:
/**
* Change the button class
*/
add_filter('bootscore/bs-load-more/class/button', function($class) {
return 'btn btn-outline-primary';
});
/**
* Change the wrapper class
*/
add_filter('bootscore/bs-load-more/class/wrapper', function($class) {
return 'text-start mt-3';
});Disable
The theme Load More can be disabled with a filter — this restores the default pagination:
/**
* Disable Load More in theme templates, keep default pagination
*/
add_filter('bootscore/load-more/theme-templates', '__return_false');WooCommerce
The plugin adds a Load More button to WooCommerce’s native product loop on shop and product archive pages, replacing the default pagination. The number of products shown and loaded per click is controlled in:
wp-admin → WooCommerce → Settings → Products → General → Products per page
Or via the Customizer under WooCommerce → Product Catalog → Products per row / rows.
Disable
The WooCommerce Load More can be disabled with a filter — this restores the default WooCommerce pagination:
/**
* Disable Load More in WooCommerce loop, keep default pagination
*/
add_filter('bootscore/load-more/woocommerce', '__return_false');bs Loop shortcodes
All bs Loop attributes are supported. The following attributes add a Load More button:
| Attribute | Description | Default |
|---|---|---|
load_more="" | true to enable the Load More button | false |
posts="" | Required — number of items to show initially and load on each click posts="5" shows 5 items, loads 5 more on each click | N/A |
bs Loop
[bs-loop type="post" tax="category" terms="sample-cat-1, sample-cat-2" load_more="true" posts="2"]bs Isotope
[bs-loop display="isotope" layout="grid" layout_mode="fit-rows" type="post" tax="category" terms="sample-cat-1, sample-cat-2" load_more="true" posts="4"]
[bs-loop type="product" display="isotope" layout="grid" layout_mode="fit-rows" tax="product_cat" terms="plugins, t-shirts" search="true" posts="4" load_more="true"]bs Swiper
[bs-loop display="swiper" layout="grid" type="post" tax="category" terms="sample-cat-1, sample-cat-2" load_more="true" posts="4"]Custom layout
[bs-loop layout="custom" context="my-custom-loop" type="post" posts="6" load_more="true"]function open_row_before_loop() {
if (isset($GLOBALS['bs_loop_contexts']) && in_array('my-custom-loop', $GLOBALS['bs_loop_contexts'])) {
echo '<div class="row row-cols-1 row-cols-md-3 g-4 mb-4 bs-loop-grid">'; // bs-loop-grid required
}
}
add_action('bootscore_before_loop', 'open_row_before_loop');
function open_col_before_loop_item() {
if (isset($GLOBALS['bs_loop_contexts']) && in_array('my-custom-loop', $GLOBALS['bs_loop_contexts'])) {
echo '<div class="col bs-loop-grid-item">'; // bs-loop-grid-item required
}
}
add_action('bootscore_before_loop_item', 'open_col_before_loop_item');