A visitor lands to your category page, scroll downs, see out of stock products first, gets disappointed and leaves the site. He left the store with a bad impression by seeing more out of stock products first and thus he even didn’t bother to scroll but leave.
For Magento 2 store owners, it is important to design the frontend of the store keeping the product stock in mind. The products having more quantity must be featured or displayed in the first fold rather than out of stock products. If a customer orders an out of stock product, his order processing takes time and hence it may deteriorate the customer experience and creates a first bad impression.
in Magento 2, if the user applies the sort options on product category such as products according to price, position or ratings, the default Magento 2 will display the products as per the filter applied. As users can’t apply two sorting options at a time, they will get results mixed with in-stock and out of stock products.
you, as a Magento 2 store owner, want to combine the filter results of the users with stock quantity, you need to customize the functionality as default Magento 2 does not facilitate it. you have to custom code to sort Magento 2 category products by stock quantity.
I have given a stepwise solution to apply two sorting options at a time, one which is selected by the user and the other is the stock quantity based sorting auto applied programmatically.
Steps to Sort Magento 2 Category Products by Stock Quantity
Step 1: Create registration.php at path app/code/Meetanshi/StockQuantity/registration.php
<?php \Magento\Framework\Component\ComponentRegistrar::register( \Magento\Framework\Component\ComponentRegistrar::MODULE, 'Meetanshi_StockQuantity', __DIR__ );
Step 2: Create module.xml at path app/code/Meetanshi/StockQuantity/etc/module.xml
<?xml version="1.0"?> <config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:Module/etc/module.xsd"> <module name="Meetanshi_StockQuantity" setup_version="1.0.0"/> </config>
Step 3: Create events.xml at path app/code/Meetanshi/StockQuantity/etc/events.xml
<?xml version="1.0"?> <config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:Event/etc/events.xsd"> <event name="catalog_block_product_list_collection"> <observer name="stockLast" instance="Meetanshi\StockQuantity\Observer\StockLast" /> </event> </config>
Step 4: Create StockLast.php at path app/code/Meetanshi/StockQuantity/Observer/StockLast.php
<?php namespace Meetanshi\StockQuantity\Observer; use Magento\Framework\Event\ObserverInterface; use Magento\Framework\App\Config\ScopeConfigInterface; use Magento\Store\Model\StoreManagerInterface; use Magento\Framework\Event\Observer; use Magento\Catalog\Block\Product\ProductList\Toolbar as CoreToolbar; class StockLast implements ObserverInterface { protected $scopeConfig; protected $_storeManager; protected $coreToolbar; public function __construct( ScopeConfigInterface $scopeConfig, StoreManagerInterface $storeManager, CoreToolbar $toolbar ) { $this->scopeConfig = $scopeConfig; $this->_storeManager = $storeManager; $this->coreToolbar = $toolbar; } public function execute(Observer $observer) { $collection = $observer->getEvent()->getData('collection'); try { $websiteId = 0; $stockId = 'stock_id'; $collection->getSelect()->joinLeft( array('_inv' => $collection->getResource()->getTable('cataloginventory_stock_status')), "_inv.product_id = e.entity_id and _inv.website_id=$websiteId", array('stock_status') ); $collection->addExpressionAttributeToSelect('in_stock', 'IFNULL(_inv.stock_status,0)', array()); $collection->getSelect()->reset('order'); $collection->getSelect()->order('in_stock DESC'); //code for Filter Price Low to High or High to Low with stock filter. if ($this->coreToolbar->getCurrentOrder() == 'price') { $direction = $this->coreToolbar->getCurrentDirection(); $collection->getSelect()->order("min_price $direction"); } } catch (\Exception $e) { } return $this; } }
The above method enables the application of two sorting options at a time on the category page to display product lists based on stock availability. You can programmatically set Magento 2 product position in a category as the product position value determines the order of products on the category page.
Hopefully, the post may have helped you sort Magento 2 category products by stock quantity, keeping the user experience in the first place!
Happy Coding!