LogoLogo
  • Magento 2 Extensions
    • SEO Extensions
      • Magento 2 Canonical Urls for Category, Product, CMS, and Other pages
      • Magento 2 Advanced SEO Suite
      • Magento 2 Cross Linking SEO
      • Magento 2 Google Page Speed Optimizer
      • Magento 2 Google Site Map Exclusion
      • Magento 2 Alternate Hreflang Tags
      • Magento 2 Google Rich Snippets
      • Magento 2 SEO Unique Catalog URLs
    • Site Speed Extensions
      • Magento 2 Full Page Cache Warmer
      • Magento 2 Google Page Speed Optimizer
      • Magento 2 Image Optimizer
      • Magento 2 AJAX Infinite Scroll
      • Magento 2 Lazy Load Image
    • Marketing Extensions
      • Magento 2 How Did You Hear About Us
      • Magento 2 Free Shipping Bar
      • Magento 2 Product Scheduler
      • Magento 2 Apply Discount coupon Code Via Link
      • Magento 2 Dynamic Sale Catagory
      • Magento 2 Facebook Conversion and Audience Pixel Tracking
      • Magento 2 Google Dynamic Remarketing Tag
      • Magento 2 Perfect Audience Tracking
      • Magento 2 Product Feed
      • Magento 2 Cash Back Discount
      • Magento 2 Competition or Prize Draw with Social Booster
      • Magento2 Custom Options Discount
      • Magento 2 Product Label
    • Analytics & Tracking Extensions
      • Magento 2 Google Global Site Tag (gtag.js) with GA4(Google Analytics 4) Enabled
      • Magento 2 Google Enhanced Ecommerce Tracking
      • Magento 2 Google Tag Manager (GTM) GA4 Ecommerce Tracking
      • Magento 2 Google Tag Manager Tracking
      • Magento 2 missing orders or transactions in Google Analytics (GA)
      • Magento 2 Consent mode's setup guide
    • Payment and Shipping Extensions
      • Magento 2 Delivery Instructions and Delivery Date
      • Magento 2 Product Handling or Additional Fee
      • Magento 2 Surcharge or Additional Fee
      • Magento 2 Shipping Carrier Tracker
    • User Experience Extensions
      • Magento 2 How Did You Hear About Us
      • Magento 2 FAQ
      • Magento 2 Subcategory Grid/List Extension
      • Magento 2 Ajax Login and Add to Wishlist
      • Magento 2 Custom Stock Status Extension
      • Magento 2 Product Shelf Life
      • Magento 2 VAT Exemption
      • Magento 2 Cancel Order by Customer on the Frontend
      • Magento 2 Lazy Load Image
      • Magento 2 AJAX Infinite Scroll
      • Magento 2 Previously Ordered Products
      • Magento 2 Social Login
      • Magento 2 Substitute Products
      • Magento 2 Product 360 view
      • Magento 2 Product Reviews
    • Admin Extensions
      • Magento 2 Update Order Email Address
      • Magento 2 Admin Action Log
      • Magento 2 Ajax Login and Add to Wishlist
      • Magento 2 Custom Stock Status Extension
      • Magento 2 Product Shelf Life
      • Magento 2 Repeat Order
      • Magento 2 Associated or Linked Product Stock Update
      • Magento 2 VAT Exemption
      • Magento 2 Order Delete or Archive
      • Magento 2 Order Tagger
      • Magento 2 Subcategory Grid/List Extension
      • Magento 2 Advanced Reporting Extension
      • Magento 2 Export Custom Product Attribute
      • Magento 2 Advanced Admin Login Security
      • Magento 2 Admin Security Checklist
      • Magento 2 Security Suite
      • Magento 2 AI Content Generator
      • Magento 2 Content Security Policy (CSP) Whitelist Manager
      • Magento 2 OTP Login
      • Magento 2 Admin Account Switcher
    • Data & Privacy Extensions
      • Magento 2 Not On The High Street Integration
      • Magento 2 GDPR Compliance: Anonymisation of order data
      • Magento 2 Antispam Extension
    • Integration Extensions
      • Magento 2 Diamond Search
      • Magento 2 Not On The High Street Integration
      • Magento 2 Creditsafe Integration
    • Installation Via Composer
  • Magento 1 Extension
    • SEO Extensions
      • Magento SEO Unique Catalog URLs
      • Jquery Asynchronous Image Loader (JAIL)
      • Magento Image Optimizer
      • Canonical Urls for Category, Product and CMS pages
      • Google Site Map Exclusion with Image sitemap
      • Google Friendly SEO Layered Navigation
      • Magento Rich Snippets & Cards (schema.org)
      • Meta Information for Any Page
    • Marketing Extensions
      • Where Did You Hear About Us?
      • Google Tag Manager Tracking
      • Google AdWords Conversion Tracking
      • Order Follow Up or Review Booster
      • Competition or Prize Draw Module with Social Booster
      • Apply Discount Coupon Code via Link
      • Abandoned Basket Email Alert
      • Cash Back Discount
      • Dynamic Sale Category
    • Analytics & Tracking Extensions
      • Google AdWords Conversion Tracking
      • Google Adwords Dynamic Remarketing Tag
      • Facebook Conversion and Audience Pixel Tracking
      • Perfect Audience Tracking
      • Google Enhanced Ecommerce Tracking
      • Magento 1 / OpenMage GA4 Google Tag Manager (GTM)
      • Magento 1 Google Global Site Tag (gtag.js)
      • Magento 1 Consent mode's setup guide
      • Magento 1 Google Analytics Synchronization Extension
    • Payment and Shipping Extensions
      • Magento Delivery Instructions or Order Comments
      • Surcharge or Additional Fee
      • Magento Surcharge or Additional Fee on Payment Method or Countries
    • User Experience Extensions
      • Product Image Resize
      • Magento Delivery Instructions or Order Comments
      • Single Product Category Redirect
      • Testimonials
    • Admin Extensions
      • Admin Order Email
      • Magento Update Order Email Address
      • Product Review Administrator Notification Email
      • Automated Product Publish Date
      • Order Follow Up or Review Booster
      • Custom Variables Anywhere
      • Testimonials
    • Data & Privacy Extensions
      • EU Cookie Notification
      • Magento 1 GDPR Compliance: Anonymisation of order data
    • Site Speed Extensions
      • Product Image Resize
      • Jquery Asynchronous Image Loader (JAIL)
      • Magento Image Optimizer
Powered by GitBook
On this page
  • Installation and User Guide for Magento 2 AJAX Infinite Scroll
  • Installation
  • Configuration Settings for Optimiser Base
  • Configuration Settings for Infinite Scrolling
  • Front-end Site View of Infinite Scroll

Was this helpful?

Export as PDF
  1. Magento 2 Extensions
  2. User Experience Extensions

Magento 2 AJAX Infinite Scroll

PreviousMagento 2 Lazy Load ImageNextMagento 2 Previously Ordered Products

Last updated 1 year ago

Was this helpful?

Installation and User Guide for Magento 2 AJAX Infinite Scroll

Table of Contents

    • Installation via app/code

    • Installation via Composer

    • General Settings

    • General Settings

    • Infinite Scroll with ‘Load More Button’ on the Category Page

    • Infinite Scroll with Auto Loading on the Category and Search Pages

    • Auto Loading on the Category Page

    • Auto Loading on the Search Page

    • Infinite Scroll with ‘Load More Button’ and Page Number

Installation

  • Installation via app/code: Upload the content of the module to your root folder. This will not overwrite the existing Magento folder or files, only the new contents will be added. After the successful upload of the package, run below commands on Magento 2 root directory.

php bin/magento setup:upgrade
php bin/magento setup:di:compile
php bin/magento setup:static-content:deploy
  • Installation via Composer: Please follow the guide provided in the below link to complete the installation via composer.

Configuration Settings for Optimiser Base

Go to Admin > Stores > Configuration > Scommerce Configuration > Optimiser Base

General Settings

  • Enabled – Select “Yes” or “No” to enable or disable the module.

Configuration Settings for Infinite Scrolling

Go to Admin > Stores > Configuration > Scommerce Configuration > Infinite Scrolling

General Settings

  • Enabled - Select “Yes” or “No” to enable or disable the module.

  • Loading Type - Select loading type “Load Automatically” or “Load with Button”.

  • Button Label - Enter button label. This will be shown only when the “Loading Type” is set to “Load with Button”.

  • Button Label Font Color - Set font color for "Load with Button" which appears on site front-end.

  • Button Label Background Color - Select button label background color. This will be shown only when the “Loading Type” is set to “Load with Button”.

  • Button Label Size – Define font size for the “Load with Button” which appears on the site.

  • Display Page Numbers (Yes/No) – Select “Yes” to show the page information on the side panel.

  • Grid Dom Class – This is the class for grid view of product listing pages.

  • List Dom Class – This is the class for list view of product listing pages.

Front-end Site View of Infinite Scroll

  • Infinite Scroll with ‘Load More Button’ on the Category Page – You can display the “Load More Button” on the category page by selecting “Load with Button” option from Admin > Stores > Configuration > Infinite Scrolling > Loading Type.

  • Infinite Scroll with Auto Loading on the Category and Search Pages – You can implement auto loading on the category and search pages by selecting the option "Load Automatically" from Admin > Stores > Configuration > Infinite Scrolling > Loading Type.

  • Auto Loading on the Category Page

  • Auto Loading on the Search Page

  • Infinite Scroll with ‘Load More Button’ and Page Number – To display Load More Button with page numbers on category and search pages first select option “Load with Button” from Admin > Stores > Configuration > Infinite Scrolling > Loading Type and then select “Yes “ from Admin > Stores > Configuration > Infinite Scrolling > Display Page Numbers. This will display page numbers with Load More Button as shown in screen grab below.

License Key – Please add the license for the extension which is provided in the order confirmation email. Please note license keys are site URL specific. If you require license keys for dev/staging sites then please email us at .

If you have a question related to this extension please check out our first. If you can't find the answer you are looking for then please contact .

Installation Via Composer
support@scommerce-mage.com
FAQ section
support@scommerce-mage.com
Installation
Configuration Settings for Optimiser Base
Configuration Settings for Infinite Scrolling
Front-end Site View of Infinite Scroll