How to Add Magento 2 Sort by Price for Low to High & High to Low Options

Hello Magento Folks,

How are you all? Have you all took the advantage of the MageComp Diwali offers? It’s the last day for MageComp Big Diwali Sale 2020. Shop now and get huge discounts on Magento Extensions and Services. In this article, I will guide you How to Add Magento 2 Sort by Price for Low to High & High to Low Options. Let’s get started. 

Quick Intro:

Ecommerce stores must have precise and user-friendly navigation that makes the customers way easy to shop from your store. Sorting is a major component to provide for user’s ease and effortless searching for the product they are finding. By default, Magento 2 is capable of providing the below-given options such as by position, product name, and price. 

Many times the customers are looking for the cheapest products and some of the customers need the high-priced products then for them the above sorting options are not efficient. For offering the options of sort by price for low to high & high to low in Magento 2 follow the below-given steps.

Steps to Add Magento 2 Sort by Price for Low to High & High to Low Options:

Step 1: create registration.php file in app\code\Vendor\Extension

<?php
\Magento\Framework\Component\ComponentRegistrar::register(\Magento\Framework\Component\ComponentRegistrar::MODULE,
'Vendor_Extension',
_DIR_
);

Step 2: Create module.xml file in app\code\Vendor\Extension\etc

<?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="Vendor_Extension" setup_version="1.0.0"/>
</config>

Step 3: Create di.xml file in app\code\Vendor\Extension\etc

<?xml version="1.0"?>
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:noNamespaceSchemaLocation="urn:magento:framework:ObjectManager/etc/config.xsd">
<type name="Magento\Catalog\Block\Product\ProductList\Toolbar">
<plugin name="custom_custom_block_toolbar" type="Vendor\Extension\Plugin\Catalog\Block\Toolbar"/>
</type>
<type name="Magento\Catalog\Model\Config">
<plugin name="custom_catalog_model_config" type="Vendor\Extension\Plugin\Catalog\Model\Config"/>
</type>
</config>

Step 4: Create Toolbar.php file in app\code\Vendor\Extension\\Plugin\Catalog\Block

<?php
namespace Vendor\Extension\Plugin\Catalog\Block;
class Toolbar
{
public function aroundSetCollection(\Magento\Catalog\Block\Product\ProductList\Toolbar $subject,
\Closure $proceed, $collection)
{
$currentOrder = $subject->getCurrentOrder();
$result = $proceed($collection);
if($currentOrder)
{
if($currentOrder == 'high_to_low')
{
$subject->getCollection()->setOrder('price', 'desc');
}
elseif ($currentOrder == 'low_to_high')
{
$subject->getCollection()->setOrder('price', 'asc');
}
}
else
{
$subject->getCollection()->getSelect()->reset('order');
$subject->getCollection()->setOrder('price', 'asc');
}
return $result;
}
}

Step 5: Create Config.php file in app\code\Vendor\Extension\Plugin\Catalog\Model

<?php
namespace Vendor\Extension\Plugin\Catalog\Model;
class Config
{
public function afterGetAttributeUsedForSortByArray(\Magento\Catalog\Model\Config $catalogConfig,
$results)
{
$results['low_to_high'] = __('Price - Low To High');
$results['high_to_low'] = __('Price - High To Low');
return $results;
}
}

That’s it.

After implementing the above solution:

Conclusion:

Most probably all are successfully able to provide sort options of Low to High & High to Low with the help of the above code. In case of any troubles write it down in the comments I will help you.

Also, share the illustration with your E-commerce friends and help them to provide sorting options in their Magento 2 store. 

Happy Reading!