Magento 2 infinite Scroll extension & Ajax Catalog Pagination.
For Best Performance and Optimization use this Extension with:
We packed it all up to offer the smoother UX for your customers and made sure that all extensions work smoothly together.
ABOUT MAGENTO 2 INFINITE SCROLL & AJAX CATALOG EXTENSION.
WHY IS THIS IMPORTANT, HOW DOES IT HELP?Magento 2 Infinite Scroll & Ajax Catalog Extension lets customers explore more content by smoothing the pagination experience or eliminating it altogether.
One of the most important parts of building your online store is creating a website with the least amount of friction. Less friction = better user experience. Needless to say, this results in a higher conversion rate; generating higher revenue and increased customer lifetime value. Category pages and search result pages are the most visited sections of your ecommerce store. It is critical that these are user friendly. Helping customers explore more content and find what they’re looking for gives them longer, more satisfying browsing experiences.
You have the option to go with two major browsing behaviours, infinite scrolling (load more) and pagination. Each UX behaviour has its benefits and we often recommend testing what works best for your customers.
Infinite scroll is commonly used by social media websites such as Facebook, Instagram and Twitter. Your customers were educated to scroll down by the Social Media giants. This user experience works great for mobile devices, which can generate 70- 80% of the total traffic depending on your industry! Another benefit of using Infinite scroll is the dynamic auto loading of new products without refreshing the entire page. Your customers can simply scroll up to view and compare previous products.
Pagination is also very commonly used around ecommerce websites such as Amazon.com and REI.com. Pagination helps divide content into multiple pages. We load the next page by using Ajax technology - reducing friction by removing the need to reload the entire page. When a user reaches the bottom of a page and clicks to go from page #1 to page #5 we dynamically load page #5 content without refreshing the page and automatically scroll the user to the top. Pagination is also helpful for product curation. You can pick the best 50 products from a category to display on the first page. This gives you more control and optimizes the initial presentation to the customer.
The Magento 2 Infinite Scroll Extension doesn’t make you choose between complete auto load or lessening the friction of pagination. We offer the best of both worlds! With this Magento extension, you can select a custom number of pages to auto load then display the load more button. This allows you to quickly display the best products automatically, while cutting down on the initial load and increasing page speed. Your customers won’t get annoyed by never reaching the bottom and you get to display the best items of each category first. It’s a 'win! win! win!' solution.
When implementing this solution we also focused heavily on improving SEO. The solution closely follows Google’s Infinite Scroll implementation. It generates rel=next and rel=prev at the correct page in conjunction with the canonical tag.
Highlights of the Magento 2 Infinite Scroll extension.
Classic pagination with modern functionality.Use Ajax Pagination for a classic display mode, with all the benefits of a smooth, modern Ajax experience which prevents the entire page from refreshing. Ajax Catalog functionality can be used on Category Pages and Search Pages.
Display the Load More button.
Choose how many pages you want to display before the Load More button shows up on the Category Page. You can even change what the button says or choose not to display it at all!
Start Loading your products early.
Create an even smoother experience by pre-loading items that are not currently in the visible screen. You can choose the distance in pixels that you want products to pre-load from the bottom of the screen.
Use Ajax functionality on Search Pages.
Ajax Catalog functionality can be applied to Category Pages, Search Pages, and Advanced Search Pages.
Features of the Extension.
- Ajax Infinite Scroll - infinite product load while scrolling down.
- Ajax Next Page - loading next page without reloading entire page.
- Upload a custom loading gif, for both Infinte Scroll and Ajax Pagination
- Reduce website friction, improve user experience, AND conversion rate.
- Helps users explore more content.
- Control the number of the pages that autoload automatically.
- "Show More" button available after a speficied number autoloaded pages.
- NEW: Loaded Items Progress Bar - display a progress bar that informs the user how many products they've already seen out of the total in the Category.
- Customizable notification messages.
- Possible to disable for search result pages.
- SEO Optimized functionality.
- Speed improvements.
- Clean open source code.
- Easy installation.
1 MINUTE INSTALLATION GUI.
-
Step 1:
Before installing please check the extension compatibility. This extension is currently compatible with the following Magento versions 2.0.X. - 2.4.7-p3. It is recommended to install the extension first on a testing server before you install it on a live (production) server. -
Step 2:
Copy the extension files to below paths of your magento 2 instance. If ‘app/code/WeltPixel’ folder is missing, please create it manually:
app/code/WeltPixel/Backend
app/code/WeltPixel/AjaxInfiniteScroll -
Step 3:
Copy the installation GUI folder 'weltpixel-extension-installation' in the root of your Magento installation. In some Magento configurations the public root folder may be under 'pub' directory.
www.yourmagentostore.com/weltpixel-extension-installation/
-
Step 4:
In your browser go to www.yourmagentostore.com/weltpixel-extension-installation/ and simply follow the installation steps from the graphical interface, presented in your browser. See the installation video: 1 Minute Module Installation via browser GUI. -
Step 5:
Wooohooo! The extension is now installed on your Magento store! Congrats!
If you experienced any issues or limitations with this quick GUI installation, see also SSH Installation below. SSH installation does the same thing but you are required to issue the commands step by step via CLI. Some servers may have high security configurations and may limit the functionality of this GUI Installer.
How to Install via SSH.
-
Step 1:
Before installing Ajax Catalog and Infinite Scroll on a Magento 2 store please check the extension compatibility. This extension is currently compatible with the following Magento versions 2.0 - 2.4.7-p3. It is recommended to install the extension first on a testing server before you install it on a live (production) server. -
Step 2:
Copy the extension files to below paths of your magento 2 instance. If ‘app/code/WeltPixel’ folder is missing, please create it manually:
app/code/WeltPixel/Backend
app/code/WeltPixel/AjaxInfiniteScroll -
Step 3:
Access the root of your magento 2 project from command line and run the following commands:
php bin/magento module:enable WeltPixel_Backend --clear-static-content
php bin/magento module:enable WeltPixel_AjaxInfiniteScroll --clear-static-content
php bin/magento setup:upgrade
-
Step 4:
Flush any cache that you might still have enabled on your server or in Magento. -
Step 5:
Woohoo, the extension is installed!
How to Upgrade the extension.
- Step 1. Remove extension code under app/code/WeltPixel/AjaxInfiniteScroll before adding the new extension files. The extension may be refactored and old unused files may cause random issues so it's best to only keep the latest version of the files.
- Step 2. Follow normal installation instructions above.
How to Configure Ajax Infinite Scroll in Magento?
General Settings:
Go to WeltPixel > Ajax Catalog & Infinite Scroll > General Configuration
- Enable Ajax Catalog and set this option to [ Yes ].
- Ajax Catalog Mode select Ajax Infinite Scroll
Functionality control for Category, Search and Advanced Search Page. When your store is integrated with external search solutions you may need to disable ajax for search pages in order to achieve default magento behaviour and therefore achieve full compatibility with other solutions.
- Use Ajax Catalog on Category Page and set this option to [ Yes ]
- Use Ajax Catalog on Search Page and set this option to [ Yes ]
- Use Ajax Catalog on Advanced Search Page and set this option to [ Yes ]
How to take Ajax Infinite Scroll to the Next Level in Magento?
- "Loading More Items" Text - Define the text that will display after the Load More button is clicked/tapped while the new content is loading
- Show number of already viewed and remaining products - Enable/Disable the Loaded Items Progress Bar functionality, which will display the number of already viewed and remaining products on the Category Page.
- Text for "Show number of already viewed and remaining products" - Choose the text you want the Loaded Items Progress Bar to display. Ex. "Loaded 12 of 100 products" - Use %1 for the number of already viewed products and %2 for the total number of products in the category.
- Show "Load more" button - In Magento you already predefined how many products to display on the category page. Let’s consider you set it to 25. This option defines after how many pages to display the load more button. Ex. 2 pages will load 2X25 products = 50 then it will display the Load More button. This option creates the balance by keeping your category pages light on initial load, having the ability to reach the footer easily and gives you the opportunity to have control over what is the most important on the page. By setting the value to 0, the Load more button will never display and it will automatically load new products until all the products from the category gets displayed.
- "Load More" button text - The text that will display on the button “Load More” / “Show More”
- No More Items Text - The text that will display as soon as all products from the category get loaded
- Start Loading Early - To Make the scrolling experience even smoother, you have now the option to pre-load products when the customers are approaching the end of the list with new products. Setting this value to Yes will prevent when there is a normal browsing experience the customer from waiting on the next page to load. This option will only work for the first few pages defined in STEP 3 or for all if set to 0
- Negative Margin - Load new items earlier considering the pixels offset configured. More items will start loading when you have less than specified pixels until the bottom of the page. Ex. 250. This option is only valid if Loading Early is set to Yes
- Enable canonical and prev/next link elements - We followed closely how Google is recommending the implementation of the rel=next, rel=prev and canonical tag.
- Custom Loading Placeholder - Enable to be able to upload your own custom loading image.
- Placeholder Width - Choose the maxmimum width of the placeholder image you uploaded in pixels. For example, for a width of 50 px, insert "50".
How to Configure Ajax Next Page in Magento?
General Settings:
Go to WeltPixel > Ajax Catalog & Infinite Scroll > General Configuration
- Enable Ajax Catalog and set this option to [ Yes ].
- Ajax Catalog Mode select Ajax Next Page
Functionality control for Category, Search and Advanced Search Page. When your store is integrated with external search solutions you may need to disable ajax for search pages in order to achieve default magento behaviour and therefore achieve full compatibility with other solutions.
- Use Ajax Catalog on Category Page and set this option to [ Yes ]
- Use Ajax Catalog on Search Page and set this option to [ Yes ]
- Use Ajax Catalog on Advanced Search Page and set this option to [ Yes ]
How to Optimize Ajax Next Page in Magento?
- "Loading More Items" Text - Define the text that will display after the Load More button is clicked/tapped while the new content is loading
- No More Items Text - The text that will display as soon as all products from the category get loaded
- Enable canonical and prev/next link elements - We followed closely how Google is recommending the implementation of the rel=next, rel=prev and canonical tag.
Compatibility | Magento Open Source, Magento Commerce, Magento Commerce Cloud B2B |
---|---|
Magento version | 2.0, 2.1, 2.2, 2.3.x, 2.4.0, 2.4.1, 2.4.2, 2.4.3, 2.4.4, 2.4.5, 2.4.6, 2.4.7 |
Update frequency | Monthly or each time a new Magento version is released |
Support period | 12 Months Included Support, with options to extend |
Refund period | 30 days, for any reason |
Updated | October 11, 2024 |
Latest version | 1.14.7 |
Code | 100% Open Source Code |
Bundle options | For best value buy it as part of the Pearl Theme or Stack Framework |
Infinite Scroll Change Log.
What’s new in v.1.14.7 - October 11, 2024
- Compatibility: Introduced compatibility with the latest Magento 2.4.7-p3, 2.4.6-p8, 2.4.5-p10 and 2.4.4-p11 versions, which come with critical security adjustments for the platform. Magento 2 merchants are urged to upgrade to the latest patches ASAP.
- Fixed an error that would sometimes be thrown in the Magento logs when the extension couldn't properly pick up the page URL for use with the canonical functionality.
- Added various code updates for increased security around the licensing functionality as well as the Help Center and WeltPixel Developer Magento Admin sections.
What’s new in v.1.14.5 - August 23, 2024
- Compatibility: Introduced compatibility with the latest Magento 2.4.7-p2, 2.4.6-p7, 2.4.5-p9 and 2.4.4-p10 versions, which come with critical security adjustments for the platform. Magento 2 merchants are urged to upgrade to the latest patches ASAP.
What’s new in v.1.14.3 - June 20, 2024
- Compatibility: Introduced compatibility with the latest Magento 2.4.7-p1, 2.4.6-p6, 2.4.5-p8, 2.4.4-p9 versions, which come with critical security adjustments for the platform. Magento 2 merchants are urged to upgrade to the latest patches ASAP.
- New Feature: Added a new section in the Magento Admin that checks to make sure the latest product version is installed and notifies in case an update is available, as well as a button that allows for new features to be requested.
What’s new in v.1.14.1 - April 19, 2024
- Added minor adjustments to "next" and "previous" page link structure for improved technical on-page SEO.
- Confirmed compatibility with the latest Magento 2.4.7 release, as well as newly released 2.4.6-p5, 2.4.5-p7 & 2.4.4-p8 Security Patches.
- Confirmed compatibility with PHP 8.3 on the Magento 2.4.7 release. PHP 8.2 is also supported for this Magento version.
- Added security improvements to the Backend module's license verification process.
What’s new in v.1.11.21 - January 9, 2024
- Added various optimizations for ADA compliance to ensure a high degree of compatibility and increased scores across testing platforms.
- Added minor adjustments for increased compatibility with Varnish Caching in conjunction with the Google Analytics 4 extension.
- Added small adjustments to the JS Parser used alongside the Speed Optimization extension for performance improvements.
- Fixed an error that would be thrown in the WeltPixel -> Extensions Version admin section when a module's composer.json file was missing the version node.
What’s new in v.1.11.19 - October 19, 2023
- New Feature: Added a new functionality that allows you to display a Progress Bar which indicates the number of products that have already been loaded, as well as the total number of products available in the Category.
- Optimized the license verification process for increased Magento Admin performance, as well as to account for licensing server downtimes.
- Fixed an issue that would sometimes result in an error being thrown when using older PHP versions, such as PHP 7.4.
- Confirmed compatibility with the newly released Magento 2.4.6-p3, 2.4.5-p5, and 2.4.4-p6 Security Patches.
What’s new in v.1.11.17 - June 28, 2023
- Fixed a bug that would cause an incorrect addition of tags to Category Pages which were configured to display as Static Blocks with products assigned.
- Added minor PHP 8.2 related adjustments.
- Confirmed compatibility with the latest Magento Security Patch releases 2.4.6-p1, 2.4.5-p3 and 2.4.4-p4.
- Fixed an error related to PHP 8.2 that would show when accessing the WeltPixel Debugger.
- Added .localdev as a universally accepted licensing domain.
What’s new in v.1.11.15 - March 22, 2023
- Fixed a bug that would occasionally prevent certain frontend notification messages from being displayed.
- Fixed an error that would sometimes be thrown in the WeltPixel Debugger, depending on various server permissions.
- Added compatibility with the latest Magento 2.4.6 and 2.4.5-p2 versions.
What’s new in v.1.11.11 - November 23, 2022
- New Feature: Added compatibility with the Google Analytics 4 PRO for sending Item List Views via Measurement Protocol.
- Confirmed compatibility with the latest Magento Security Patch releases 2.4.5-p1 and 2.4.4-p2.
What’s new in v.1.11.7 - September 1, 2022
- Confirmed compatibility with the latest Magento 2.4.5 and 2.4.4-p1 versions.
- Updated installation/upgrade scripts to use data patches.
What’s new in v.1.11.1 - April 25, 2022
- Initiated a clear of the dataLayer eCommerce object before a push event - This applies only when using the extension together with the Google Tag Manager and/or Google Analytics 4 modules.
- Fixed an incorrect licensing message on B2B Magento Enterprise instances which would display when an invalid license was entered.
- Confirmed compatibility with the latest Magento 2.4.4 and 2.3.7-p3 versions as well as PHP 8.1.
What’s new in v.1.10.17 - October 22, 2021
- Fixed a bug that that caused an inability to load a product collection when accessing a Product Page and clicking the back button in a browser after having initially filtered products using an attribute ending in the letter "p". This only happened in conjunction with the Layered Navigation extension.
- Confirmed compatibility with the latest Magento 2.4.3-p1 and 2.3.7-p2 versions.
What’s new in v.1.10.15 - August 31, 2021
- Improved item counter clarity on Category Pages when in Infinite Scroll mode.
- Confirmed compatibility with the newly released Magento 2.4.3, 2.4.2-p2 and 2.3.7-p1 versions.
- Added .localhost as an accepted domain termination for the licensing process.
Version 1.10.11 - July 7, 2021
- Fixed a console error that would be thrown on Category Pages when Categories or Products had special characters in their names.
- Added improvments to the WeltPixel Developer Magento Admin section. Latest Cron Jobs now lists the last 100 executed Cron Jobs.
Version 1.10.9 - May 18, 2021
- Confirmed compatibility with the newly released Magento 2.3.7 and 2.4.2-p1 versions.
Version 1.10.7 - March 26, 2021
- Excluded Magento 2.0.x - 2.2.x from new features and fixes starting with this release.
- Adjusted WeltPixel Developer section comments.
Version 1.10.5 - February 12, 2021
- Fixed a bug that caused the Quick View button to lose stying when changing the page via Infinite Scroll (Only when using the Quick View extension).
- Fixed a bug that caused the Infinite Scroll functionality to break on certain configurations.
- Fixed a display issue related to default Magento Pagination Anchor Text aligments.
- Confirmed compatibility with the newly released Magento 2.4.2 version.
- Added additional backend versioning verifications.
- Backend code optimizations.
Version 1.10.1 - October 22, 2020
- Added design and functionality adjustments in Grid View for smoother UX.
- Confirmed compatibility with the newly released Magento 2.4.1 version.
Version 1.10.0 - August 10, 2020
- Fixed an issue that prevented the custom loader uploaded from being displayed when the extnsion was configured to use Ajax Next Page.
- Confirmed compatibility with the newly released Magento 2.4.0 version.
Version 1.9.8 - July 6, 2020
- New Feature: Added the possibility of uploading a Custom Loader for Ajax Catalog and Ajax Infinite Scroll functionalities.
- Whitelisted domain for Content Security Policies introduced in Magento 2.3.5.
Version 1.9.7 - May 7, 2020
- Confirmed compatibility with Magento 2.3.5.
- Implemented small Backend performance optimizations.
- Added nxcli.net (Nexcess temporary URL) as a valid domain in the licensing process.
- Added an option in the Developer section to allow for switching Magento's CSP between "report-only" and "restrict".
Version 1.9.6 - April 9, 2020
- Fixed a Backend issue on Magento Commerce whereby the Category Schedule functionality was not working properly.
Version 1.9.5 - March 10, 2020
- Fixed an issue that caused a console error when using special characters in the Advanced Settings section of the extension configuration.
- Added backend Google reCaptcha compatibility for Magento 2.3.x
Version 1.9.4 - February 5, 2020
- Fixed a bug which, in some cases, prevented items from being added to cart after a page load with infinite scroll.
- Code enhancements for increased security. Changed User Group info collection method.
- Confirmed compatibility for Magento 2.3.4.
Version 1.9.2 - November 27, 2019
- Fixed a bug which caused Swatches to display incorrectly after filtering or sorting via Ajax.
- Added Magento and PHP version in the WeltPixel Developer section.
Version 1.9.1 - October 16, 2019
- Fixed an issue which caused pages to become unresponsive when switching pages via Infinte Scroll when the Magento Option to Redirect to Cart Page on Add to Cart was set to Yes.
- Fixed an issue that caused Swatches to disappear from the Category Page products after sorting or filtering and scrolling to the next page.
- Confirmed compatibility with the latst Magento 2.3.3 version.
- Included the WeSupply Toolbox integration extension - Proactive Notifications Email & SMS, Returns & RMA, Store Locator, Delivery Date Estimate, Logistics Analytics, NPS & CSAT score. Get Free on-boarding and launch within 24 hours.
Version 1.9.0 - July 18, 2019
- Confirmed compatibility with Magento 2.3.2.
- Added HTTPS endpoint for licensing process.
Version 1.8.5 - June 7, 2019
- Small performance improvements.
Version 1.8.4 - April 25, 2019
- Added PHP version in the WeltPixel Developer Section.
Version 1.8.3 - April 3rd, 2019
- Fixed an issue whereby the Load Previous Items button text could not be changed.
- Confirmed compatibility for Magento 2.3.1.
Version 1.8.2 - January 24, 2019
- Fix for padding issues when swatch option is set to yes on category page.
- Removed console log.
- Removed CategoryPage helper dependancy and moved it into the theme instead of this extension.
- Fixed a bug that prevented correct functionality of Layered Navigation if Infinite Scroll was disabled - compatibility fixes.
- Helpcenter adjustment, removed zendesk iframe and added a simple link to our Support Center in order to avoid any potential conflicts with other admin js added by 3rd party extensions.
- Fix for multiple rewritten ImageFactory classes, rewrite check validity, rewrite checks optimizations.
Version 1.8.0 - December 8, 2018
- Compatibility adjustments for Magento 2.1.16/2.2.7/2.3.0.
- PHP 7.2 compatibility added.
- As Magento 2.3 comes with major core changes, we have provided a different set of files in order to achieve the best performance on each version.
Version 1.7.5 - October 24, 2018
- Fixed CTRL+Click issue on category page, now pages open in a new tab.
- Added compatibility with our newly released WeltPixel Product Labels Extension.
- Added detailed error messages for invalid licenses for an easier identification of the cause.
- License improvements, added *.magento.cloud as a valid test domain for Enterprise Cloud environments. Now both ‘magentosite.cloud’ and ‘magneto.cloud’ can be used for testing purpose with the production domain license.
Version 1.7.4 - August 25, 2018
- Fixed bundle js error / production mode.
- Added 'Load previous items' option in admin to configure text / translation.
- Added compatibility with just released Advance Category Sorting extension by WeltPixel.
- Admin menu styling to fit screen size 1366px.
- Fix for production mode with merged JS - missing color pallet display now fixed.
Version 1.7.3 - August 23, 2018
- Infinite Scroll compatibility with Layered Navigation - improvements and optimizations.
- License improvements, adding *.magento.cloud as a valid test domain.
Version 1.7.2 - August 2, 2018
- WeltPixel Layered Navigation - Ajax infinite scroll pagination fix.
- Google Tag Manager compatibility - data layer impressions push for ajax loaded content.
- Fixed JS srror: Cannot read property length of null”.
- Fixed swatches loading after ajax call.
- Fixed admin random logout issue.
- Licensing improvements, allowing 3 letter domain as valid domain.
What's new in v.1.7.1 - July 11, 2018
- Compatibility with Magento 2.2.5 both Open Source & Commerce Cloud B2B.
- Added domain.test & [any_subdomain].domain.test to the list of valid urls for staging/development environments. Added domain validation with port number included for licensing purpose.
- Added licensing compatibility with Magento B2B.
Version 1.7.0 - July 5, 2018
- Added option to enable/disable WeltPixel admin notifications.
- Show store and server related information under debugging tab: Magento Mode, Magento Edition, Server User, Magento Installation Path, Current server time, Latest cron jobs.
- Added licensing, license key needs to be generated under weltpixel.com account for purchased product, based on domain name and added under your magento installation.
Version 1.6.4 - May 16, 2018
- Compatibility with Magento 2.2.4, logger broken reference fix, changed to rewrite from plugin.
- Removed extra parameter from store url generated by infinite scroll functionality
- Fix for ‘previous page load’, now when user hits the back button and returns in listing view mode, will land on the last page loaded with ajax or infinite scroll (ex: listing page 4)
Version 1.0 - February 23, 2018
- Initial release