For Users

Installation

First way to install plugin:

  1. Download plugin from your BeRocket account
  2. Open your site admin panel and go to Plugins -> Add New -> Upload Plugin
  3. Click Browse and select downloaded zip file and click Install Now
  4. Click Activate Plugin

 

Second way to install plugin:  

  1. Download plugin from your BeRocket account
  2. Open your site via FTP
  3. Go to WordPress folder/wp-content/plugins
  4. Extract files from downloaded zip file and copy extracted folders to plugins folder
  5. Open your site admin panel and go to Plugins
  6. Find WooCommerce Load More Products and click Activate under it

Setup

Compatibility With Theme

If you use theme with components that different from components on standard theme, that can cause some problems after products filtering. You can fix this problem yourself.

  1. Open admin panel of your site and go to WooCommerce -> Load More Products -> Selectors tab
  2. For fix problem you need to set right next fields Products selector, Product count selector, Product order by selector and Products pagination selector, or if you already use our WooCommerce AJAX Products Filter plugin you can enable Use selectors from WooCommerce AJAX Products Filter plugin option.
  3. By default that used:
    • Products Container Selector: ul.products
    • Product Item Selector: li.product
    • Product count selector: .woocommerce-result-count
    • Pagination Selector: .woocommerce-pagination
    • Next Page Selector .woocommerce-pagination a.next
  4. What value you need to set you can see at shop page via page inspector of your browser (If you do not know how to do it, then ask the author's themes)

Settings

WooCommerce Load More Products have settings in Admin Panel -> WooCommerce -> Load More Products

General

Contains settings for select load type and stylization for products load.

  • Products Loading Type - Type of products load
    • Infinity Scroll - load next products on scrolling
    • Load More Button - load next products on button click
    • AJAX Pagination - Use default pagination but load products with AJAX
  • Different load type with small devices - another load type for devices with screen width less than Maximum width for small devices
  • Type for small devices - Load type for small devices
  • Maximum width for small devices - all devices with width less than this option is small devices
  • Loading Image - image that displayed on products loading
    • Rotating image on load - rotate image with CSS (if you use static image or font awesome icon).
  • Buffer Pixels - pixels from bottom of the products block to bottom of the screen bottom position when next products will be loads.

Button

Setting for stylization load more button.

  • Text on button - text on button that uses for products loading
  • Custom Class - custom class on load more button
  • Background color - background color on load more button
  • Background color on mouse over - background color on load more button when cursor over button
  • Text color - text color on load more button
  • Text color on mouse over - text color on load more button when cursor over button
  • Font size - text size on load more button
  • Padding left - padding left from text on load more buttom
  • Padding right - padding right from text on load more buttom
  • Padding top - padding top from text on load more buttom
  • Padding bottom - padding bottom from text on load more buttom

Selectors

Settings for compatibility with theme.

  • Use selectors from WooCommerce AJAX Products Filter plugin - all selectors will be generated from WooCommerce AJAX Products Filter plugin
  • Products Container Selector - Container with products, must contain all products
  • Product Item Selector - selector for each product
  • Pagination Selector - current pagination on shop page
  • Next Page Selector - selector for link that uses for open next page

Lazy Load

Settings for image lazy load.

  • Enable Lazy Load - use lazy load for image that loaded with WooCommerce Load More Products plugin
  • Enable Lazy Load on small devices - use lazy load on small devices for image that loaded with WooCommerce Load More Products plugin
  • Load Animation - animation for products that contains image loaded with Lazy Load

Messages

Settings for text, that uses in different places.

  • Loading Text - text that displayed rightside from loading image
  • Custom Class for Loading Text - custom class for text that displayed rightside from loading image
  • Products End Message - text that displayed on last page
  • Custom Class for Products End Message - custom class for text that displayed on last page

JavaScript

Custom JavaScript code.

  • Before Update - JavaScript that execute before products load
  • After Update - JavaScript that execute after products load

License

  • Plugin key - uses for updates plugin from BeRocket site. You can get this on BeRocket site -> My Account page on click key icon

For Developers

Filter hooks

berocket_lmp_load_more_button

Filter for html code with Load More Buttons

Parameters

  1. button html code - string with button html code

Usage

<?php
function change_load_more_buttons ( $button ) {
//your code here
    return $button;
}

add_filter( 'berocket_lmp_load_more_button', 'change_load_more_buttons' );
?>

berocket_lmp_user_func

Filter for user functions

Parameters

  1. functions - array with user functions

Usage

<?php
function change_lmp_user_func ( $functions ) {
//your code here
    return $functions;
}

add_filter( 'berocket_lmp_user_func', 'change_lmp_user_func' );
?>

berocket_lmp_products_selector

Filter for product selector

Parameters

  1. selector - string with current selector

Usage

<?php
function change_lmp_products_selector ( $selector ) {
//your code here
    return $selector;
}

add_filter( 'berocket_lmp_products_selector', 'change_lmp_products_selector' );
?>

berocket_lmp_item_selector

Filter for product item selector

Parameters

  1. selector - string with current selector

Usage

<?php
function change_lmp_item_selector ( $selector ) {
//your code here
    return $selector;
}

add_filter( 'berocket_lmp_item_selector', 'change_lmp_item_selector' );
?>

berocket_lmp_pagination_selector

Filter for pagination selector

Parameters

  1. selector - string with current selector

Usage

<?php
function change_lmp_pagination_selector ( $selector ) {
//your code here
    return $selector;
}

add_filter( 'berocket_lmp_pagination_selector', 'change_lmp_pagination_selector' );
?>

berocket_lmp_next_page_selector

Filter for next page selector

Parameters

  1. selector - string with current selector

Usage

<?php
function change_lmp_page_selector ( $selector ) {
//your code here
    return $selector;
}

add_filter( 'berocket_lmp_page_selector', 'change_lmp_page_selector' );
?>

Functions

includes/functions.php

br_get_woocommerce_version()

Public function to get WooCommerce version

return string. woocommerce version

br_is_plugin_active( $plugin_name, $version = '1.0.0.0', $version_end = '9.9.9.9' )

Public function to check is plugin activated.

  • $plugin_name - list of plugin name:
    • filters - WooCommerce AJAX Products Filter
    • list-grid - WooCommerce Grid/List View
    • more-products - WooCommerce Load More Products
  • $version - minimum plugin version
  • $version_end - maximum plugin version

 return boolean. is plugin with this version activated

load-more-products.php

All of these functions is in class BeRocket_LMP as static functions.

get_load_more_button()

Public function to get load more button

return string. html code with load more button

get_lmp_option( $option_name )

Public function to get settings from load more plugin

  • $option_name - name of settings tab:
    • br_lmp_general_settings - settings from General tab
    • br_lmp_button_settings - settings from Button tab
    • br_lmp_selectors_settings - settings from Selectors tab
    • br_lmp_lazy_load_settings - settings from Lazy Load tab
    • br_lmp_messages_settings - settings from Messages tab
    • br_lmp_javascript_settings - settings from JavaScript tab
    • br_lmp_license_settings - settings from License tab

return array. Array with settings. All settings you can find in BeRocket_LMP class in static variables $defaults.

Options

All settings you can find in BeRocket_LMP class in static variables $defaults.

public static $defaults = array(
    'br_lmp_general_settings'   => array(
        'type'                      => 'infinity_scroll',
        'use_mobile'                => '',
        'mobile_type'               => 'more_button',
        'mobile_width'              => '767',
        'products_per_page'         => '',
        'loading_image'             => 'fa-spinner',
        'rotate_image'              => '1',
        'buffer'                    => '50',
    ),
    'br_lmp_button_settings'    => array(
        'button_text'               => 'Load More',
        'custom_class'              => '',
        'background-color'          => '#aaaaff',
        'color'                     => '#333333',
        'font-size'                 => '22',
        'padding-left'              => '25',
        'padding-right'             => '25',
        'padding-top'               => '15',
        'padding-bottom'            => '15',
        'hover'                     => array(
            'background-color'          => '#9999ff',
            'color'                     => '#111111',
        ),
    ),
    'br_lmp_selectors_settings' => array(
        'use_filters_settings'      => '',
        'products'                  => 'ul.products',
        'item'                      => 'li.product',
        'pagination'                => '.woocommerce-pagination',
        'next_page'                 => '.woocommerce-pagination a.next',
    ),
    'br_lmp_lazy_load_settings' => array(
        'use_lazy_load'             => '',
        'use_lazy_load_mobile'      => '',
        'animation'                 => '',
    ),
    'br_lmp_messages_settings'  => array(
        'loading'                   => 'Loading...',
        'loading_class'             => '',
        'end_text'                  => 'No more products',
        'end_text_class'            => '',
    ),
    'br_lmp_javascript_settings'=> array(
        'before_update'             => '',
        'after_update'              => '',
    ),
    'br_lmp_license_settings'   => array(
        'plugin_key'                => '',
    ),
);

 

Files

  • load-more-products.php - main plugin file
  • css - folder with CSS files
    • admin.css - styles for admin panel
    • animate.min.css - animation for products loads with lazy loads
    • colpick.css - styles for color picker block
    • font-awesome.min.css - standard Font Awesome styles
    • load_products.css - front end styles
    • select_fa.css - styles for font awesome icons selector
  • fonts - Font Awesome fonts
  • includes - folder with additional PHP files
    • functions.php - public functions
    • updater.php - BeRocket Updater for plugins update from BeRocket site
  • js - folder with JavaScript files
    • admin.js - JavaScript for admin panel settings
    • admin_select_fa.js - scripts for font awesome icons selector
    • colpick.js - JavaScript for color picker in admin panel settings
    • jquery.lazyloadxt.min.js - image lazy loading script
    • load_products.js - JavaScript for front end
  • templates - templates for settings
    • button_settings.php - template for Button tab in settings
    • general_settings.php - template for General tab in settings
    • javascript_settings.php - template for JavaScript tab in settings
    • lazy_load_settings.php - template for Lazy Load tab in settings
    • license_settings.php - template for License tab in settings
    • messages_settings.php - template for Messages tab in settings
    • selectors_settings.php - template for Selectors tab in settings
    • settings.php - main plugin settings page